<color>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Тип <color> CSS data type предоставляет цвет в цветовом спектре sRGB. В <color> может включать значения прозрачности Альфа-канала (alpha-channel), указывающие, как цвет сочетается с его фоном.

В <color> может быть определена любым из следующих способов can.

**Примечание:**В этой статье подробно описывается тип данных <color>. Дополнительные сведения об использовании цвета в HTML см. В разделе применение цвета к элементам HTML с помощью CSS.

Синтаксис

Для типа данных задаётся <color> с помощью одного из следующих параметров.

Примечание: Значения <color> точно определены, их фактический внешний вид может отличаться (иногда значительно) от устройства к устройству. Это связано с тем что большинство устройств не откалиброваны, а некоторые браузеры не поддерживают цветовые профили устройств вывода.

Ключевые цвета

Ключевые слова для цвета - это идентификаторы без учёта регистра, представляющие определённый цвет, например red, blue, black или lightseagreen. Хотя названия более или менее описывают их соответствующие цвета, они по существу искусственны, без строгого обоснования используемых имён.

Есть несколько предостережений, которые следует учитывать при использовании ключевых слов цвета:

  • HTML распознает только 16 основных цветовых ключевых слов, найденных в CSS1, используя определённый алгоритм для преобразования нераспознанных значений (часто в совершенно разные цвета). Другие ключевые слова цвета должны использоваться только в CSS и SVG.

  • В отличие от HTML, CSS будет полностью игнорировать неизвестные ключевые слова.

  • Ключевые слова цвета все представляют собой простые, сплошные цвета, без прозрачности.

  • Несколько ключевых слов являются псевдонимами друг для друга:

    • aqua / cyan
    • fuchsia / magenta
    • darkgray / darkgrey
    • darkslategray / darkslategrey
    • dimgray / dimgrey
    • lightgray / lightgrey
    • lightslategray / lightslategrey
    • gray / grey
    • slategray / slategrey
  • Хотя многие ключевые слова были адаптированы из X11, их значения RGB могут отличаться от соответствующего цвета в системах X11, поскольку производители иногда адаптируют цвета X11 к своему конкретному оборудованию.

Спецификация Эквивалент RGB Ключевое слово RGB hex значение Видео сайта
CSS Level 1 black #000000
silver #c0c0c0
gray #808080
white #ffffff
maroon #800000
red #ff0000
purple #800080
fuchsia #ff00ff
green #008000
lime #00ff00
olive #808000
yellow #ffff00
navy #000080
blue #0000ff
teal #008080
aqua #00ffff
CSS Level 2 (Revision 1) orange #ffa500
CSS Color Module Level 3 aliceblue #f0f8ff
antiquewhite #faebd7
aquamarine #7fffd4
azure #f0ffff
beige #f5f5dc
bisque #ffe4c4
blanchedalmond #ffebcd
blueviolet #8a2be2
brown #a52a2a
burlywood #deb887
cadetblue #5f9ea0
chartreuse #7fff00
chocolate #d2691e
coral #ff7f50
cornflowerblue #6495ed
cornsilk #fff8dc
crimson #dc143c
cyan
(synonym of aqua)
#00ffff
darkblue #00008b
darkcyan #008b8b
darkgoldenrod #b8860b
darkgray #a9a9a9
darkgreen #006400
darkgrey #a9a9a9
darkkhaki #bdb76b
darkmagenta #8b008b
darkolivegreen #556b2f
darkorange #ff8c00
darkorchid #9932cc
darkred #8b0000
darksalmon #e9967a
darkseagreen #8fbc8f
darkslateblue #483d8b
darkslategray #2f4f4f
darkslategrey #2f4f4f
darkturquoise #00ced1
darkviolet #9400d3
deeppink #ff1493
deepskyblue #00bfff
dimgray #696969
dimgrey #696969
dodgerblue #1e90ff
firebrick #b22222
floralwhite #fffaf0
forestgreen #228b22
gainsboro #dcdcdc
ghostwhite #f8f8ff
gold #ffd700
goldenrod #daa520
greenyellow #adff2f
grey #808080
honeydew #f0fff0
hotpink #ff69b4
indianred #cd5c5c
indigo #4b0082
ivory #fffff0
khaki #f0e68c
lavender #e6e6fa
lavenderblush #fff0f5
lawngreen #7cfc00
lemonchiffon #fffacd
lightblue #add8e6
lightcoral #f08080
lightcyan #e0ffff
lightgoldenrodyellow #fafad2
lightgray #d3d3d3
lightgreen #90ee90
lightgrey #d3d3d3
lightpink #ffb6c1
lightsalmon #ffa07a
lightseagreen #20b2aa
lightskyblue #87cefa
lightslategray #778899
lightslategrey #778899
lightsteelblue #b0c4de
lightyellow #ffffe0
limegreen #32cd32
linen #faf0e6
magenta
(synonym of fuchsia)
#ff00ff
mediumaquamarine #66cdaa
mediumblue #0000cd
mediumorchid #ba55d3
mediumpurple #9370db
mediumseagreen #3cb371
mediumslateblue #7b68ee
mediumspringgreen #00fa9a
mediumturquoise #48d1cc
mediumvioletred #c71585
midnightblue #191970
mintcream #f5fffa
mistyrose #ffe4e1
moccasin #ffe4b5
navajowhite #ffdead
oldlace #fdf5e6
olivedrab #6b8e23
orangered #ff4500
orchid #da70d6
palegoldenrod #eee8aa
palegreen #98fb98
paleturquoise #afeeee
palevioletred #db7093
papayawhip #ffefd5
peachpuff #ffdab9
peru #cd853f
pink #ffc0cb
plum #dda0dd
powderblue #b0e0e6
rosybrown #bc8f8f
royalblue #4169e1
saddlebrown #8b4513
salmon #fa8072
sandybrown #f4a460
seagreen #2e8b57
seashell #fff5ee
sienna #a0522d
skyblue #87ceeb
slateblue #6a5acd
slategray #708090
slategrey #708090
snow #fffafa
springgreen #00ff7f
steelblue #4682b4
tan #d2b48c
thistle #d8bfd8
tomato #ff6347
turquoise #40e0d0
violet #ee82ee
wheat #f5deb3
whitesmoke #f5f5f5
yellowgreen #9acd32
CSS Color Module Level 4 rebeccapurple #663399

Прозрачное ключевое слово

Ключевое слово transparent представляет собой полностью прозрачный цвет. Это делает фон позади цветного элемента полностью видимым. Технически transparent- это ярлык для rgba (0,0,0,0).

currentColor ключевое слово

Ключевое слово currentColor представляет значение свойства элемента color. Это позволяет использовать значение color для свойств, которые не получают его по умолчанию.

Если текущий цвет используется в качестве значения свойства color , он вместо этого принимает его значение из наследуемого значения свойства color.

currentColor пример

html
<div style="color:blue; border: 1px dashed currentColor;">
  Цвет текста-синий.
  <div style="background:currentColor; height:9px;"></div>
  This block is surrounded by a blue border.
</div>

RGB цвет

Цветовая модель RGB определяет заданный цвет в соответствии с его красными, зелёными и синими компонентами. Дополнительный Альфа-компонент представляет прозрачность цвета.

Синтаксис

Цвета RGB могут быть выражены как шестнадцатеричными (с префиксом #), так и функциональными (rgb (), rgba ()) нотациями.

Шестнадцатеричное представление: #RRGGBB[AA]

R (red), G (green), B (blue), and A (alpha) are hexadecimal characters (0-9, A-F). A is optional. For example, #ff0000 is equivalent to #ff0000ff. R (красный), G (зелёный), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Например, #ff0000 эквивалентно #ff0000ff.

Шестнадцатеричное представление: #RGB[A]

R (красный), G (зелёный), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Трёхзначная нотация (#RGB) является более короткой версией шестизначной формы (#RRGGBB). Например, #f09 имеет тот же цвет, что и #ff0099. Кроме того, четырёхзначная нотация RGB (#RGB) является более короткой версией восьмизначной формы (#RRGGBBAA). Например, #0f38 имеет тот же цвет, что и #00ff3388.

Функциональная нотация: rgb(R, G, B[, A]) или rgba(R, G, B, A)

R (красный), G (зелёный) и B (синий) могут быть либо <number>s, либо <percentage>s, где число 255 соответствует 100%. А (Альфа) может быть <number> между 0 и 1 или <percentage>, где число 1 соответствует 100% (полная непрозрачность).

Функциональная нотация: rgb(R G B[ A]) or rgba(R G B A)

CSS Colors Level 4 добавляет поддержку разделённых пробелами значений в функциональной нотации.

Пример

RGB варианты синтаксиса

В этом примере показано множество способов создания одного цвета с помощью различных цветовых синтаксисов RGB.

css
/* Все эти варианты синтаксиса задают один и тот же цвет: полностью непрозрачный ярко-розовый. */

/* Шестнадцатеричный синтаксис */
#f09
#F09
#ff0099
#FF0099

/* Функциональный синтаксис */
rgb(255,0,153)
rgb(255, 0, 153)
rgb(255, 0, 153.0)
rgb(100%,0%,60%)
rgb(100%, 0%, 60%)
rgb(100%, 0, 60%) /* Ошибка! Не смешивайте цифры и проценты. */
rgb(255 0 153)

/* Шестнадцатеричный синтаксис с Альфа-значением */
#f09f
#F09F
#ff0099ff
#FF0099FF

/* Функциональный синтаксис с Альфа-значением */
rgb(255, 0, 153, 1)
rgb(255, 0, 153, 100%)

/* Синтаксис пробелов */
rgb(255 0 153 / 1)
rgb(255 0 153 / 100%)

/* Функциональный синтаксис со значением floats */
rgb(255, 0, 153.6, 1)
rgb(1e2, .5e1, .5e0, +.25e2%)
RGB вариации прозрачности
css
/* Шестнадцатеричный синтаксис */
#3a30                    /*   0% непрозрачный зелёный цвет */
#3A3F                    /* полный непрозрачный зелёный цвет */
#33aa3300                /*   0% непрозрачный зелёный цвет */
#33AA3380                /* 50% непрозрачный зелёный цвет */

/* Функциональный синтаксис */
rgba(51, 170, 51, .1)    /* непрозрачный зелёный цвет на 10%  */
rgba(51, 170, 51, .4)    /* непрозрачный зелёный цвет на */
rgba(51, 170, 51, .7)    /* непрозрачный зелёный цвет на 70% */
rgba(51, 170, 51,  1)    /* полный непрозрачный зелёный цвет  */

/* Синтаксис пробелов */
rgba(51 170 51 / 0.4)    /* непрозрачный зелёный цвет  на 40%*/
rgba(51 170 51 / 40%)    /* непрозрачный зелёный цвет на 40% */

/* Функциональный синтаксис со значением floats */
rgba(255, 0, 153.6, 1)
rgba(1e2, .5e1, .5e0, +.25e2%)

Цвет HSL

Цветовая модель HSL определяет заданный цвет в соответствии с его компонентами оттенка, насыщенности и яркости. Дополнительный Альфа-компонент представляет прозрачность цвета.

Многие дизайнеры считают HSL более интуитивным, чем RGB, поскольку он позволяет независимо регулировать оттенок, насыщенность и лёгкость. HSL также может упростить создание набора подходящих цветов (например, когда вы хотите несколько оттенков одного оттенка).

Синтаксис

Цвета HSL выражаются через функциональные обозначения hsl() и hsla().

Функциональная нотация: hsl(H, S, L[, A]) или hsla(H, S, L, A)

H (hue) - это <угол> цветового круга, заданного в degS, rads, градусах или поворотах CSS Color Module Level 4. При записи в виде unitless <number> он интерпретируется как Градусы, как указано в CSS Color Module Level 3. По определению, red=deg=360 град, с другими цветами, распространёнными по кругу, поэтому green=120deg град, blue=240deg град и т. д. В качестве < угла > он неявно обёртывается таким образом, что -120deg=240deg, 480deg=120deg, -1turn=1turn, и т. д.S (насыщенность) и L (лёгкость) являются процентами. 100% насыщенность полностью насыщена, в то время как 0% полностью ненасыщен (серый). 100% лёгкость белый, 0% лёгкость чёрный, и 50% лёгкость "нормально". A (alpha) can be a <number> between 0 and 1, or a <percentage>, where the number 1 corresponds to 100% (full opacity). A (Альфа) может быть <number> между 0 и 1 или <percentage>, где число 1 соответствует 100% (полная непрозрачность).

Функциональная нотация: hsl(H S L[ A]) or hsla(H S L A)

CSS Colors Level 4 добавляет поддержку разделённых пробелами значений в функциональной нотации.

Examples

HSL варианты синтаксиса
css
/* Все эти примеры указывают один и тот же цвет: лаванда. */
hsl(270,60%,70%)
hsl(270, 60%, 70%)
hsl(270 60% 70%)
hsl(270deg, 60%, 70%)
hsl(4.71239rad, 60%, 70%)
hsl(.75turn, 60%, 70%)

/* Все эти примеры указывают один и тот же цвет: лаванда, которая на 15% непрозрачна. */
hsl(270, 60%, 50%, .15)
hsl(270, 60%, 50%, 15%)
hsl(270 60% 50% / .15)
hsl(270 60% 50% / 15%)
Полностью насыщенные цвета
Нотация Описание: Итог
hsl(0, 100%, 50%) red
hsl(30, 100%, 50%) orange
hsl(60, 100%, 50%) yellow
hsl(90, 100%, 50%) lime green
hsl(120, 100%, 50%) green
hsl(150, 100%, 50%) blue-green
hsl(180, 100%, 50%) cyan
hsl(210, 100%, 50%) sky blue
hsl(240, 100%, 50%) blue
hsl(270, 100%, 50%) purple
hsl(300, 100%, 50%) magenta
hsl(330, 100%, 50%) pink
hsl(360, 100%, 50%) red
Более светлая и более тёмная зелень
Нотация Описание: Итог
hsl(120, 100%, 0%) black
hsl(120, 100%, 20%)
hsl(120, 100%, 40%)
hsl(120, 100%, 60%)
hsl(120, 100%, 80%)
hsl(120, 100%, 100%) white
Насыщенная и ненасыщенная зелень
Нотация Описание: Итог
hsl(120, 100%, 50%) green
hsl(120, 80%, 50%)
hsl(120, 60%, 50%)
hsl(120, 40%, 50%)
hsl(120, 20%, 50%)
hsl(120, 0%, 50%) gray
Вариации прозрачности HSL
css
hsla(240, 100%, 50%, .05)     /* непрозрачный синий на 5% */
hsla(240, 100%, 50%, .4)      /* непрозрачный синий на 40% */
hsla(240, 100%, 50%, .7)      /* непрозрачный синий на 70% */
hsla(240, 100%, 50%, 1)       /* полный непрозрачный синий */

/* Синтаксис пробелов */
hsla(240 100% 50% / .05)      /* непрозрачный синий на  5% */

/* Процентное значение для Альфа */
hsla(240 100% 50% / 5%)       /*  непрозрачный синий на 5% */

Системный цвет

Не все системные цвета поддерживаются на всех системах. Устарело для использования на общедоступных веб-страницах.

ActiveBorder

Активная граница окна.

ActiveCaption

Активный заголовок окна. Должен использоваться с текстом CaptionText в качестве цвета переднего плана.

AppWorkspace

Цвет фона интерфейса нескольких документов.

Background

Фон рабочего стола.

ButtonFace

Цвет фона лица для трёхмерных элементов, которые появляются 3-D из-за одного слоя окружающей границы. Следует использовать с текстом ButtonText цвет переднего плана.

ButtonHighlight

Цвет границы, обращённой к источнику света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы.

ButtonShadow

Цвет границы вдали от источника света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы. Цвет границы находится вдали от источника света для трёхмерных элементов, которые появляются 3-D из-за этого слоя, окружающего границу.

ButtonText

Следует использовать с ButtonFace или ThreeDFace цвет фона.

CaptionText

Текст в заголовке, поле размера и поле со стрелкой прокрутки. Следует использовать с цветом фона ActiveCaption.

GrayText

Серый (отключён) текст.

Highlight

Элемент(ы), выбранный в элементе управления. Следует использовать с HighlightText текста цветом переднего плана.

HighlightText

Текст элемента(ов), выбранного в элементе управления. Следует использовать с подсветкой цвета фона.

InactiveBorder

Граница неактивного окна.

InactiveCaption

Заголовок неактивного окна. Должен использоваться с цветом переднего плана InactiveCaptionText.

InactiveCaptionText

Следует использовать с InactiveCaption неактивным цветом фона заголовка.

InfoBackground

Цвет фона для элементов управления всплывающей подсказки. Должен использоваться с цветом переднего плана InfoText.

InfoText

Цвет текста элементов подсказки. Должен использоваться с и InfoBackground фона.

Фон меню. Должен использоваться с MenuText или -moz-MenuBarText строки меню цвет переднего плана.

Текст в меню. Следует использовать с меню Цвет фона.

Scrollbar

Цвет фона полос прокрутки.

ThreeDDarkShadow

Цвет более тёмной (как правило, внешней) из двух границ от источника света для трёхмерных элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.

ThreeDFace

Should be used with the ButtonText foreground color. Цвет фона лица для трёхмерных элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы. Следует использовать с текстом кнопки цвет переднего плана.

ThreeDHighlight

Цвет более светлого (обычно внешнего) из двух границ, обращённых к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.

ThreeDLightShadow

Цвет более тёмной (обычно внутренней) из двух границ, обращённых к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.

ThreeDShadow

Цвет более светлого (как правило, внутреннего) из двух границ от источника света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.

Window

Фон окна. Следует использовать с WindowText цвет переднего плана.

WindowFrame

Оконная рама

WindowText

Текст в windows. Следует использовать с цветом фона окна.

Расширенные Цвета Системы Mozilla

  • -moz-ButtonDefault

    • : Цвет границы вокруг кнопки, которые обозначают действие по умолчанию для диалогового окна.
  • -moz-ButtonHoverFace

    • : Цвет фона кнопки, на которую наведён указатель мыши (который будет Трёхлинейным или лицом кнопки, когда указатель мыши не находится над ним). Следует использовать с-moz-кнопка наведения текста цвет переднего плана.
  • -moz-ButtonHoverText

    • : Цвет текста кнопки, на которую наведён указатель мыши (который будет ButtonText, когда указатель мыши не находится над ним). Следует использовать с--moz-ButtonHoverFace background color.
  • -moz-CellHighlight

    • : Цвет фона для выбранного элемента в виджете дерево. Следует использовать с цветом переднего плана -moz-CellHighlightText. Смотрите также-moz-html-CellHighlight.
  • -moz-CellHighlightText

    • : Цвет текста для выбранного элемента в дереве. Следует использовать с цветом фона moz-CellHighlight background. Смотрите также -moz-html-CellHighlightText выделения ячейки.
  • -moz-Combobox

    • : цвет фона для комбинированных полей -moz-ComboboxText. Должен использоваться с цветом переднего плана текста-moz-Combobox. В версиях до 1.9.2 вместо этого используйте -moz-Field.
  • -moz-ComboboxText

    • : цвет текста для комбинированных полей. Следует использовать с цветом фона -moz-Combobox. В версиях до 1.9.2 вместо этого используйте -moz-FieldText.
  • -moz-Dialog

    • : Цвет фона для диалоговых окон. Должен использоваться с цветом переднего плана --moz-DialogText.
  • -moz-DialogText

    • : Цвет текста для диалоговых окон. Должен использоваться с цветом фона -moz-Dialog.
  • -moz-dragtargetzone

    -moz-EvenTreeRow

    • : цвет фона для чётных строк в дереве. Должен использоваться с цветом переднего плана -moz-FieldText. В версиях Gecko до 1.9, используйте-moz-поле. Смотрите также -moz-OddTreeRow.
  • -moz-Field

    • : Text field background color. Should be used with the -moz-FieldText foreground color. Цвет фона текстового поля. Должен использоваться с цветом переднего плана-moz-FieldText.
  • -moz-FieldText

    • : Text field text color. Should be used with the -moz-Field, -moz-EvenTreeRow, or -moz-OddTreeRow background color. Текстовое поле цвет текста. Следует использовать с -moz-Field, -moz-EvenTreeRow или -moz-OddTreeRow цветом фона строки дерева.
  • -moz-html-CellHighlight

    • : Background color for highlighted item in HTML <select>s. Should be used with the -moz-html-CellHighlightText foreground color. Prior to Gecko 1.9, use -moz-CellHighlight. цвет фона для выделенного элемента в HTML <select> s. должен использоваться с цветом переднего плана -moz-html-CellHighlight. До Gecko 1.9, используйте -moz-CellHighlightText.
  • -moz-html-CellHighlightText

    • : цвет текста для -moz-html-CellHighlight выделенных элементов в HTML <select> s. должен использоваться с цветом фона. До Gecko 1.9, используйте moz-html-CellHighlight.
  • -moz-mac-accentdarkestshadow

    -moz-mac-accentdarkshadow

    -moz-mac-accentface

    -moz-mac-accentlightesthighlight

    -moz-mac-accentlightshadow

    -moz-mac-accentregularhighlight

    -moz-mac-accentregularshadow

    -moz-mac-chrome-active

  • -moz-mac-chrome-inactive

  • -moz-mac-focusring

    -moz-mac-menuselect

    -moz-mac-menushadow

    -moz-mac-menutextselect

    -moz-MenuHover

    • : Цвет фона для зависших пунктов меню. Часто похожи на Highlight. Следует использовать с moz-MenuHoverText или -moz-MenuBarHoverText при наведении цвет текста переднего плана.
  • -moz-MenuHoverText

    • : Text color for hovered menu items. Often similar to HighlightText. Should be used with the -moz-MenuHover background color. Цвет текста для зависших пунктов меню. Часто похоже на выделение текста HighlightText. Следует использовать с -moz-MenuHover наведите цвет фона.
  • -moz-MenuBarText

    • : цвет текста в строках меню. Часто похоже на текст меню "MenuText". Должен использоваться поверх фона Menu.
  • -moz-MenuBarHoverText

    • : Цвет для зависшего текста в строках меню. Часто похоже на -moz-MenuHoverText меню наведения текста. Следует использовать поверх -moz-MenuHover наведите фон.
  • -moz-nativehyperlinktext

    • : цвет гиперссылки платформы по умолчанию.
  • -moz-OddTreeRow

    • : цвет фона для нечётных строк в дереве. Должен использоваться с цветом переднего плана -moz-FieldText. В версиях Gecko до 1.9, используйте -moz-Field. Смотрите также -moz-EvenTreeRow.
  • -moz-win-communicationstext

    • : следует использовать для текста в объектах с - moz-appearance:- moz-win-communications-toolbox;.
  • -moz-win-mediatext

    • : следует использовать для текста в объектах с - moz-appearance:- moz-win-media-toolbox.
  • -moz-win-accentcolor

    • : Используется для доступа к пользовательскому цвету акцента Windows 10, который можно установить в меню Пуск, панели задач, заголовках и т. д.
  • -moz-win-accentcolortext

    • : Используется для доступа к цвету текста, размещённого над цветом пользовательского акцента Windows 10 в меню Пуск, панели задач, заголовках и т. д.

Расширения Цветовых Предпочтений Mozilla

-moz-activehyperlinktext

Пользовательское предпочтение цвета текста активных ссылок. Должен использоваться с цветом фона документа по умолчанию.

-moz-default-background-color

предпочтения пользователя для цвета фона документа.

-moz-default-color

предпочтения пользователя для цвета текста.

-moz-hyperlinktext

Предпочтения пользователя для цвета текста непрошеных ссылок. Должен использоваться с цветом фона документа по умолчанию.

-moz-visitedhyperlinktext

Предпочтения пользователя для цвета текста посещённых ссылок. Должен использоваться с цветом фона документа по умолчанию.

Интерполяция

В анимации и градиентах значения <color> интерполируются на каждый из их красных, зелёных и синих компонентов. Каждый компонент интерполируется как реальное число с плавающей запятой. Обратите внимание, что интерполяция цветов происходит в Альфа-предварительно умноженном цветовом пространстве rgba, чтобы предотвратить появление неожиданных серых цветов. В анимации, скорость интерполяции определяется функцией времени.

Соображения доступности

Некоторые люди с трудом различают цвета. Рекомендация WCAG 2.0 настоятельно рекомендует не использовать цвет в качестве единственного средства передачи определённого сообщения, действия или результата. Дополнительную информацию см. В разделе цвет и цветовой контраст.

Спецификации

Specification
CSS Color Module Level 4
# color-syntax

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также