Главная Программы Кислотно зеленый цвет код. Цвет в стилях можно задавать разными способами: по шестнадцатеричному значению, по названию, в формате RGB, RGBA, HSL, HSLA

Кислотно зеленый цвет код. Цвет в стилях можно задавать разными способами: по шестнадцатеричному значению, по названию, в формате RGB, RGBA, HSL, HSLA

Модуль CSS color подробно описывает значения, которые позволяют авторам определять цвета и непрозрачность html-элементов, а также значения свойства color .

Свойство color

1. Приоритетные цвета: свойство color

Свойство задаёт цвет шрифта с помощью различных систем цветопередачи. Свойство описывает цвет текстового содержимого элемента. Кроме того, оно используется для предоставления потенциального косвенного значения (currentColor) для любых других свойств, которые принимают значения цвета.

Свойство наследуется.

2. Значения цвета

2.1. Основные ключевые слова

Список основных ключевых слов включает в себя следующие значения:

Название	HEX	RGB
black	#000000	0,0,0
silver	#C0C0C0	192,192,192
gray	#808080	128,128,128
white	#FFFFFF	255,255,255
maroon	#800000	128,0,0
red	#FF0000	255,0,0
purple	#800080	128,0,128
fuchsia	#FF00FF	255,0,255
green	#008000	0,128,0
lime	#00FF00	0,255,0
olive	#808000	128,128,0
yellow	#FFFF00	255,255,0
navy	#000080	0,0,128
blue	#0000FF	0,0,255
teal	#008080	0,128,128
aqua	#00FFFF	0,255,255

Названия цветов не чувствительны к регистру.

Синтаксис

Color: teal;

2.2. Числовые значения цвета

2.2.1. Цвета модели RGB

Формат значения RGB в шестнадцатеричном формате — это знак # , за которым сразу следуют три или шесть шестнадцатеричных символов. Трехзначная запись RGB #rgb преобразуется в шестизначную форму #rrggbb путем копирования цифр, а не путем добавления нулей. Например, #fb0 расширяется до #ffbb00 . Это гарантирует, что белый #ffffff может быть указан в короткой записи #fff , и удаляет любые зависимости от глубины цвета дисплея.

Формат значения RGB в функциональной нотации — rgb(, за которым следует разделенный запятыми список из трех числовых значений (либо трех целочисленных значений, либо трех процентных значений), за которыми следует символ) . Целочисленное значение 255 соответствует 100% и F или FF в шестнадцатеричной записи:

Rgb (255,255,255) = rgb (100%, 100%, 100%) = #FFF

Символы пробела допускаются вокруг числовых значений.

Для html страниц цвета обозначаются в основном в шестнадцатеричной системе. Для этого используют два вида записи кода - полную или сокращенную. Чтобы правильно указать html цвет полной записью необходимо прописать шесть знаков (цифры и/или английские буквы) после решетки, например, черный записывается так: #000000. Сокращенная запись указания html цветов состоит из решетки и трех цифр и/или букв за ней. При этом данный вид запаси можно использовать только в том случае, если полная запись данного цвета состоит одинаковых символов после решетки. Например, этот же черный цвет можно записать так: #000. Указывать html цвета можно как большими, так и маленькими символами, так как они не чувствительны к регистру.

Каждый символ, записанный после "#" соответствует определенной доли красного, зеленого и синего цветов. В свою очередь все мониторы состоят из огромного количества пикселей (микроскопических точек), каждый из которых включает в себя по 3 так называемых "фонарика" (источника света): красны, зеленый и синий. Затем, регулируя интенсивность излучаемого света этими "фонариками", монитор отображает нужный нам цвет.

Сочетая интенсивность излучения красного, синего и зеленого света (от 0 для 256) мониторы могут отображать 16.000.000 различных оттенков.

Также цвета для сайтов могут указываться словесно или в RGB коде.

На сегодняшний день словесно можно прописать 147 цветов. При этом важно знать, что некоторые разные названия могут обозначать одинаковые цвета, например Gray и Grey - это серый цвет (#808080).

Безопасные цвета для сайтов.

Не каждый монитор и браузер может правильно отображать все 16 миллионов html цветов.

Если, например, попадается такой цвет, который браузер не может правильно отобразить, то:

Браузер заменяет его на тот, который больше всего на него похож и может быть удачно воспроизведен;
Для правильного отображения браузер может смешать несколько цветов и воспроизвести результат.

Чтобы гарантированно получить на выходе в любом браузере и на любом мониторе тот цвет, который Вы прописали в коде, рекомендуется использовать "Безопасные цвета". Они были определены не вручную или по чьему-то желанию, а математически. Таких на 100% безопасных цветов для html документов существует 216. И хотя сегодняшние технологии дошли до того, что современные мониторы и браузеры распознают миллионы оттенков, мы рекомендуем для гарантии цветопередачи использовать именно эти безопасные цвета.

Таблица безопасных цветов html.

Шестнадцатеричная система цветов.	Коды цветов в RGB (Red, Green, Blue).
Код html цвета: #000000	Цвет RGB: 0 0 0
Код html цвета: #333333	Цвет RGB: 51 51 51
Код html цвета: #666666	Цвет RGB: 102 102 102
Код html цвета: #999999	Цвет RGB: 153 153 153
Код html цвета: #CCCCCC	Цвет RGB: 204 204 204
Код html цвета: #FFFFFF	Цвет RGB: 255 255 255
Код html цвета: #666600	Цвет RGB: 102 102 0
Код html цвета: #999900	Цвет RGB: 153 153 0
Код html цвета: #999933	Цвет RGB: 153 153 51
Код html цвета: #999966	Цвет RGB: 153 153 102
Код html цвета: #CCCC33	Цвет RGB: 204 204 51
Код html цвета: #CCCC66	Цвет RGB: 204 204 102
Код html цвета: #333300	Цвет RGB: 51 51 0
Код html цвета: #666633	Цвет RGB: 102 102 51
Код html цвета: #CCCC99	Цвет RGB: 204 204 153
Код html цвета: #CCFF33	Цвет RGB: 204 255 51
Код html цвета: #CCFF00	Цвет RGB: 204 255 0
Код html цвета: #CCFF66	Цвет RGB: 204 255 102
Код html цвета: #669900	Цвет RGB: 102 153 0
Код html цвета: #99CC33	Цвет RGB: 153 204 51
Код html цвета: #99CC00	Цвет RGB: 153 204 0
Код html цвета: #99CC66	Цвет RGB: 153 204 102
Код html цвета: #99FF33	Цвет RGB: 153 255 51
Код html цвета: #99FF00	Цвет RGB: 153 255 0
Код html цвета: #336600	Цвет RGB: 51 102 0
Код html цвета: #669933	Цвет RGB: 102 153 51
Код html цвета: #66CC33	Цвет RGB: 102 204 51
Код html цвета: #66CC00	Цвет RGB: 102 204 0
Код html цвета: #99FF66	Цвет RGB: 153 255 102
Код html цвета: #CCFF99	Цвет RGB: 204 255 153
Код html цвета: #009900	Цвет RGB: 0 153 0
Код html цвета: #339900	Цвет RGB: 51 153 0
Код html цвета: #33CC00	Цвет RGB: 51 204 0
Код html цвета: #33FF00	Цвет RGB: 51 255 0
Код html цвета: #66FF33	Цвет RGB: 102 255 51
Код html цвета: #66FF00	Цвет RGB: 102 255 0
Код html цвета: #00CC33	Цвет RGB: 0 204 51
Код html цвета: #33CC33	Цвет RGB: 51 204 51
Код html цвета: #00CC00	Цвет RGB: 0 204 0
Код html цвета: #00FF00	Цвет RGB: 0 255 0
Код html цвета: #00FF33	Цвет RGB: 0 255 51
Код html цвета: #33FF33	Цвет RGB: 51 255 51
Код html цвета: #003300	Цвет RGB: 0 51 0
Код html цвета: #336633	Цвет RGB: 51 102 51
Код html цвета: #669966	Цвет RGB: 102 153 102
Код html цвета: #66CC66	Цвет RGB: 102 204 102
Код html цвета: #99CC99	Цвет RGB: 153 204 153
Код html цвета: #CCFFCC	Цвет RGB: 204 255 204
Код html цвета: #006600	Цвет RGB: 0 102 0
Код html цвета: #339933	Цвет RGB: 51 153 51
Код html цвета: #00FF66	Цвет RGB: 0 255 102
Код html цвета: #33FF66	Цвет RGB: 51 255 102
Код html цвета: #66FF66	Цвет RGB: 102 255 102
Код html цвета: #99FF99	Цвет RGB: 153 255 153
Код html цвета: #009933	Цвет RGB: 0 153 51
Код html цвета: #00CC66	Цвет RGB: 0 204 102
Код html цвета: #33CC66	Цвет RGB: 51 204 102
Код html цвета: #00FF99	Цвет RGB: 0 255 153
Код html цвета: #33FF99	Цвет RGB: 51 255 153
Код html цвета: #66FF99	Цвет RGB: 102 255 153
Код html цвета: #006633	Цвет RGB: 0 102 51
Код html цвета: #009966	Цвет RGB: 0 153 102
Код html цвета: #339966	Цвет RGB: 51 153 102
Код html цвета: #00CC99	Цвет RGB: 0 204 153
Код html цвета: #33CC99	Цвет RGB: 51 204 153
Код html цвета: #66CC99	Цвет RGB: 102 204 153
Код html цвета: #009999	Цвет RGB: 0 153 153
Код html цвета: #33CCCC	Цвет RGB: 51 204 204
Код html цвета: #00FFCC	Цвет RGB: 0 255 204
Код html цвета: #33FFCC	Цвет RGB: 51 255 204
Код html цвета: #66FFCC	Цвет RGB: 102 255 204
Код html цвета: #99FFCC	Цвет RGB: 153 255 204
Код html цвета: #00CCCC	Цвет RGB: 0 204 204
Код html цвета: #00FFFF	Цвет RGB: 0 255 255
Код html цвета: #33FFFF	Цвет RGB: 51 255 255
Код html цвета: #66FFFF	Цвет RGB: 102 255 255
Код html цвета: #99FFFF	Цвет RGB: 153 255 255
Код html цвета: #CCFFFF	Цвет RGB: 204 255 255
Код html цвета: #336666	Цвет RGB: 51 102 102
Код html цвета: #006666	Цвет RGB: 0 102 102
Код html цвета: #669999	Цвет RGB: 102 153 153
Код html цвета: #339999	Цвет RGB: 51 153 153
Код html цвета: #66CCCC	Цвет RGB: 102 204 204
Код html цвета: #99CCCC	Цвет RGB: 153 204 204
Код html цвета: #003333	Цвет RGB: 0 51 51
Код html цвета: #0099CC	Цвет RGB: 0 153 204
Код html цвета: #3399CC	Цвет RGB: 51 153 204
Код html цвета: #00CCFF	Цвет RGB: 0 204 255
Код html цвета: #33CCFF	Цвет RGB: 51 204 255
Код html цвета: #66CCFF	Цвет RGB: 102 204 255
Код html цвета: #006699	Цвет RGB: 0 102 153
Код html цвета: #336699	Цвет RGB: 51 102 153
Код html цвета: #6699CC	Цвет RGB: 102 153 204
Код html цвета: #0099FF	Цвет RGB: 0 153 255
Код html цвета: #3399FF	Цвет RGB: 51 153 255
Код html цвета: #99CCFF	Цвет RGB: 153 204 255
Код html цвета: #003366	Цвет RGB: 0 51 102
Код html цвета: #003399	Цвет RGB: 0 51 153
Код html цвета: #0033FF	Цвет RGB: 0 51 255
Код html цвета: #3366CC	Цвет RGB: 51 102 204
Код html цвета: #0066CC	Цвет RGB: 0 102 204
Код html цвета: #0066FF	Цвет RGB: 0 102 255
Код html цвета: #000033	Цвет RGB: 0 0 51
Код html цвета: #0033CC	Цвет RGB: 0 51 204
Код html цвета: #0000CC	Цвет RGB: 0 0 204
Код html цвета: #0000FF	Цвет RGB: 0 0 255
Код html цвета: #3366FF	Цвет RGB: 51 102 255
Код html цвета: #6699FF	Цвет RGB: 102 153 255
Код html цвета: #000066	Цвет RGB: 0 0 102
Код html цвета: #000099	Цвет RGB: 0 0 153
Код html цвета: #3333CC	Цвет RGB: 51 51 204
Код html цвета: #3300CC	Цвет RGB: 51 0 204
Код html цвета: #3300FF	Цвет RGB: 51 0 255
Код html цвета: #3333FF	Цвет RGB: 51 51 255
Код html цвета: #333366	Цвет RGB: 51 51 102
Код html цвета: #333399	Цвет RGB: 51 51 153
Код html цвета: #666699	Цвет RGB: 102 102 153
Код html цвета: #6666CC	Цвет RGB: 102 102 204
Код html цвета: #6666FF	Цвет RGB: 102 102 255
Код html цвета: #9999CC	Цвет RGB: 153 153 204
Код html цвета: #330066	Цвет RGB: 51 0 102
Код html цвета: #330099	Цвет RGB: 51 0 153
Код html цвета: #6600FF	Цвет RGB: 102 0 255
Код html цвета: #6633FF	Цвет RGB: 102 51 255
Код html цвета: #9999FF	Цвет RGB: 153 153 255
Код html цвета: #CCCCFF	Цвет RGB: 204 204 255
Код html цвета: #330033	Цвет RGB: 51 0 51
Код html цвета: #663399	Цвет RGB: 102 51 153
Код html цвета: #6633CC	Цвет RGB: 102 51 204
Код html цвета: #6600CC	Цвет RGB: 102 0 204
Код html цвета: #9966FF	Цвет RGB: 153 102 255
Код html цвета: #9966CC	Цвет RGB: 153 102 204
Код html цвета: #663366	Цвет RGB: 102 51 102
Код html цвета: #660099	Цвет RGB: 102 0 153
Код html цвета: #9900FF	Цвет RGB: 153 0 255
Код html цвета: #9933FF	Цвет RGB: 153 51 255
Код html цвета: #9933CC	Цвет RGB: 153 51 204
Код html цвета: #CC99FF	Цвет RGB: 204 153 255
Код html цвета: #660066	Цвет RGB: 102 0 102
Код html цвета: #996699	Цвет RGB: 153 102 153
Код html цвета: #9900CC	Цвет RGB: 153 0 204
Код html цвета: #CC00FF	Цвет RGB: 204 0 255
Код html цвета: #CC33FF	Цвет RGB: 204 51 255
Код html цвета: #CC66FF	Цвет RGB: 204 102 255
Код html цвета: #993399	Цвет RGB: 153 51 153
Код html цвета: #990099	Цвет RGB: 153 0 153
Код html цвета: #CC33CC	Цвет RGB: 204 51 204
Код html цвета: #CC00CC	Цвет RGB: 204 0 204
Код html цвета: #CC66CC	Цвет RGB: 204 102 204
Код html цвета: #CC99CC	Цвет RGB: 204 153 204
Код html цвета: #CC3399	Цвет RGB: 204 51 153
Код html цвета: #FF00FF	Цвет RGB: 255 0 255
Код html цвета: #FF33FF	Цвет RGB: 255 51 255
Код html цвета: #FF66FF	Цвет RGB: 255 102 255
Код html цвета: #FF99FF	Цвет RGB: 255 153 255
Код html цвета: #FFCCFF	Цвет RGB: 255 204 255
Код html цвета: #990066	Цвет RGB: 153 0 102
Код html цвета: #CC0099	Цвет RGB: 204 0 153
Код html цвета: #CC6699	Цвет RGB: 204 102 153
Код html цвета: #FF33CC	Цвет RGB: 255 51 204
Код html цвета: #FF00CC	Цвет RGB: 255 0 204
Код html цвета: #FF66CC	Цвет RGB: 255 102 204
Код html цвета: #660033	Цвет RGB: 102 0 51
Код html цвета: #993366	Цвет RGB: 153 51 102
Код html цвета: #CC0066	Цвет RGB: 204 0 102
Код html цвета: #FF0099	Цвет RGB: 255 0 153
Код html цвета: #FF3399	Цвет RGB: 255 51 153
Код html цвета: #FF99CC	Цвет RGB: 255 153 204
Код html цвета: #663333	Цвет RGB: 102 51 51
Код html цвета: #996666	Цвет RGB: 153 102 102
Код html цвета: #CC3366	Цвет RGB: 204 51 102
Код html цвета: #FF0066	Цвет RGB: 255 0 102
Код html цвета: #FF3366	Цвет RGB: 255 51 102
Код html цвета: #FF6699	Цвет RGB: 255 102 153
Код html цвета: #330000	Цвет RGB: 51 0 0
Код html цвета: #990033	Цвет RGB: 153 0 51
Код html цвета: #993333	Цвет RGB: 153 51 51
Код html цвета: #CC3333	Цвет RGB: 204 51 51
Код html цвета: #CC6666	Цвет RGB: 204 102 102
Код html цвета: #CC9999	Цвет RGB: 204 153 153
Код html цвета: #CC0033	Цвет RGB: 204 0 51
Код html цвета: #FF0033	Цвет RGB: 255 0 51
Код html цвета: #FF3333	Цвет RGB: 255 51 51
Код html цвета: #FF6666	Цвет RGB: 255 102 102
Код html цвета: #FF9999	Цвет RGB: 255 153 153
Код html цвета: #FFCCCC	Цвет RGB: 255 204 204
Код html цвета: #990000	Цвет RGB: 153 0 0
Код html цвета:#CC0000	Цвет RGB: 204 0 0
Код html цвета: #FF0000	Цвет RGB: 255 0 0
Код html цвета: #FF3300	Цвет RGB: 255 51 0
Код html цвета: #CC3300	Цвет RGB: 204 51 0
Код html цвета: #FF6633	Цвет RGB: 255 102 51
Код html цвета: #660000	Цвет RGB: 102 0 0
Код html цвета: #993300	Цвет RGB: 153 51 0
Код html цвета: #CC6633	Цвет RGB: 204 102 51
Код html цвета: #FF6600	Цвет RGB: 255 102 0
Код html цвета: #FF9966	Цвет RGB: 255 153 102
Код html цвета: #FFCC99	Цвет RGB: 255 204 153
Код html цвета: #663300	Цвет RGB: 102 51 0
Код html цвета: #996633	Цвет RGB: 153 102 51
Код html цвета: #CC6600	Цвет RGB: 204 102 0
Код html цвета: #CC9966	Цвет RGB: 204 153 102
Код html цвета: #FF9933	Цвет RGB: 255 153 51
Код html цвета: #FF9900	Цвет RGB: 255 153 0
Код html цвета: #996600	Цвет RGB: 153 102 0
Код html цвета: #CC9933	Цвет RGB: 204 153 51
Код html цвета: #CC9900	Цвет RGB: 204 153 0
Код html цвета: #FFCC33	Цвет RGB: 255 204 51
Код html цвета: #FFCC00	Цвет RGB: 255 204 0
Код html цвета: #FFCC66	Цвет RGB: 255 204 102
Код html цвета: #CCCC00	Цвет RGB: 204 204 0
Код html цвета: #FFFF00	Цвет RGB: 255 255 0
Код html цвета: #FFFF33	Цвет RGB: 255 255 51
Код html цвета: #FFFF66	Цвет RGB: 255 255 102
Код html цвета: #FFFF99	Цвет RGB: 255 255 153
Код html цвета: #FFFFCC	Цвет RGB: 255 255 204

Данная таблица включает в себя 216 кодов безопасных html цветов. Каждый цвет имеет значение в RGB для определения цвета в графических редакторах и HEX для указания цвета на html страницах.

На этой странице приведена таблица с ключевыми словами, которые можно использовать для обозначения цветов в таких языках Web-разработчика как: HTML, CSS, JavaScript, Flash, и др.

В старых спецификацияк концерна WC3 было прописано лишь 16 ключевых слов, при помощи которых устанавливались цвета в HTML и CSS. В дальнейших, более современных спецификациях, было добавлено ещё 130 ключевых слов для обозначения названий цветов. Следующая таблица содержит имена цветов, шестнадцатеричный и RGB коды, которым они соответствуют.

В соответствии с правилами CSS имена цвето не чувствительны к регистру. Записи цвета IndianRed и indianred равнозначны.

Также стоит обратить внимание, что из 146 ключевых слов таблицы, цветов в ней на самом деле меньше. Это вызвано тем, что некоторые ключевые слова обозначают один и тот же цвет. Так имена Grey , и Gray обозначают 50-процентный серый цвет с кодом #808080 , а слово Magenta - это синоним HTML цвета Fuchsia , соответствующего шестнадцатеричному коду #FF00FF . Также синонимами являются слова Aqua и Cyan , они соответствуют коду #00FFFF .

Имя цвета в HTML и CSS	HEX	RGB
Красные тона:
IndianRed	#CD5C5C	205, 92, 92
LightCoral	#F08080	240, 128, 128
Salmon	#FA8072	250, 128, 114
DarkSalmon	#E9967A	233, 150, 122
LightSalmon	#FFA07A	255, 160, 122
Crimson	#DC143C	220, 20, 60
Red	#FF0000	255, 0, 0
FireBrick	#B22222	178, 34, 34
DarkRed	#8B0000	139, 0, 0
Розовые тона:
Pink	#FFC0CB	255, 192, 203
LightPink	#FFB6C1	255, 182, 193
HotPink	#FF69B4	255, 105, 180
DeepPink	#FF1493	255, 20, 147
MediumVioletRed	#C71585	199, 21, 133
PaleVioletRed	#DB7093	219, 112, 147
Оранжевые тона:
LightSalmon	#FFA07A	255, 160, 122
Coral	#FF7F50	255, 127, 80
Tomato	#FF6347	255, 99, 71
OrangeRed	#FF4500	255, 69, 0
DarkOrange	#FF8C00	255, 140, 0
Orange	#FFA500	255, 165, 0
Жёлтые тона:
Gold	#FFD700	255, 215, 0
Yellow	#FFFF00	255, 255, 0
LightYellow	#FFFFE0	255, 255, 224
LemonChiffon	#FFFACD	255, 250, 205
LightGoldenrodYellow	#FAFAD2	250, 250, 210
PapayaWhip	#FFEFD5	255, 239, 213
Moccasin	#FFE4B5	255, 228, 181
PeachPuff	#FFDAB9	255, 218, 185
PaleGoldenrod	#EEE8AA	238, 232, 170
Khaki	#F0E68C	240, 230, 140
DarkKhaki	#BDB76B	189, 183, 107
Фиолетовые тона:
Lavender	#E6E6FA	230, 230, 250
Thistle	#D8BFD8	216, 191, 216
Plum	#DDA0DD	221, 160, 221
Violet	#EE82EE	238, 130, 238
Orchid	#DA70D6	218, 112, 214
Fuchsia	#FF00FF	255, 0, 255
Magenta	#FF00FF	255, 0, 255
MediumOrchid	#BA55D3	186, 85, 211
MediumPurple	#9370DB	147, 112, 219
BlueViolet	#8A2BE2	138, 43, 226
DarkViolet	#9400D3	148, 0, 211
DarkOrchid	#9932CC	153, 50, 204
DarkMagenta	#8B008B	139, 0, 139
Purple	#800080	128, 0, 128
Indigo	#4B0082	75, 0, 130
SlateBlue	#6A5ACD	106, 90, 205
DarkSlateBlue	#483D8B	72, 61, 139
Коричневые тона:
Cornsilk	#FFF8DC	255, 248, 220
BlanchedAlmond	#FFEBCD	255, 235, 205
Bisque	#FFE4C4	255, 228, 196
NavajoWhite	#FFDEAD	255, 222, 173
Wheat	#F5DEB3	245, 222, 179
BurlyWood	#DEB887	222, 184, 135
Tan	#D2B48C	210, 180, 140
RosyBrown	#BC8F8F	188, 143, 143
SandyBrown	#F4A460	244, 164, 96
Goldenrod	#DAA520	218, 165, 32
DarkGoldenRod	#B8860B	184, 134, 11
Peru	#CD853F	205, 133, 63
Chocolate	#D2691E	210, 105, 30
SaddleBrown	#8B4513	139, 69, 19
Sienna	#A0522D	160, 82, 45
Brown	#A52A2A	165, 42, 42
Maroon	#800000	128, 0, 0
Основные цвета:
Black	#000000	0, 0, 0
Gray	#808080	128, 128, 128
Silver	#C0C0C0	192, 192, 192
White	#FFFFFF	255, 255, 255

Fuchsia	#FF00FF	255, 0, 255
Purple	#800080	128, 0, 128
Red	#FF0000	255, 0, 0
Maroon	#800000	128, 0, 0

Yellow	#FFFF00	205, 92, 92
Olive	#808000	240, 128, 128
Lime	#00FF00	250, 128, 114
Green	#008000	233, 150, 122

Aqua	#00FFFF	205, 92, 92
Teal	#008080	240, 128, 128
Blue	#0000FF	250, 128, 114
Navy	#000080	233, 150, 122

Имя цвета в HTML и CSS	HEX	RGB
Зелёные тона:
GreenYellow	#ADFF2F	173, 255, 47
Chartreuse	#7FFF00	127, 255, 0
LawnGreen	#7CFC00	124, 252, 0
Lime	#00FF00	0, 255, 0
LimeGreen	#32CD32	50, 205, 50
PaleGreen	#98FB98	152, 251, 152
LightGreen	#90EE90	144, 238, 144
MediumSpringGreen	#00FA9A	0, 250, 154
SpringGreen	#00FF7F	0, 255, 127
MediumSeaGreen	#3CB371	60, 179, 113
SeaGreen	#2E8B57	46, 139, 87
ForestGreen	#228B22	34, 139, 34
Green	#008000	0, 128, 0
DarkGreen	#006400	0, 100, 0
YellowGreen	#9ACD32	154, 205, 50
OliveDrab	#6B8E23	107, 142, 35
Olive	#808000	128, 128, 0
DarkOliveGreen	#556B2F	85, 107, 47
MediumAquamarine	#66CDAA	102, 205, 170
DarkSeaGreen	#8FBC8F	143, 188, 143
LightSeaGreen	#20B2AA	32, 178, 170
DarkCyan	#008B8B	0, 139, 139
Teal	#008080	0, 128, 128
Синие тона:
Aqua	#00FFFF	0, 255, 255
Cyan	#00FFFF	0, 255, 255
LightCyan	#E0FFFF	224, 255, 255
PaleTurquoise	#AFEEEE	175, 238, 238
Aquamarine	#7FFFD4	127, 255, 212
Turquoise	#40E0D0	64, 224, 208
MediumTurquoise	#48D1CC	72, 209, 204
DarkTurquoise	#00CED1	0, 206, 209
CadetBlue	#5F9EA0	95, 158, 160
SteelBlue	#4682B4	70, 130, 180
LightSteelBlue	#B0C4DE	176, 196, 222
PowderBlue	#B0E0E6	176, 224, 230
LightBlue	#ADD8E6	173, 216, 230
SkyBlue	#87CEEB	135, 206, 235
LightSkyBlue	#87CEFA	135, 206, 250
DeepSkyBlue	#00BFFF	0, 191, 255
DodgerBlue	#1E90FF	30, 144, 255
CornflowerBlue	#6495ED	100, 149, 237
MediumSlateBlue	#7B68EE	123, 104, 238
RoyalBlue	#4169E1	65, 105, 225
Blue	#0000FF	0, 0, 255
MediumBlue	#0000CD	0, 0, 205
DarkBlue	#00008B	0, 0, 139
Navy	#000080	0, 0, 128
MidnightBlue	#191970	25, 25, 112
Белые тона:
White	#FFFFFF	255, 255, 255
Snow	#FFFAFA	255, 250, 250
Honeydew	#F0FFF0	240, 255, 240
MintCream	#F5FFFA	245, 255, 250
Azure	#F0FFFF	240, 255, 255
AliceBlue	#F0F8FF	240, 248, 255
GhostWhite	#F8F8FF	248, 248, 255
WhiteSmoke	#F5F5F5	245, 245, 245
Seashell	#FFF5EE	255, 245, 238
Beige	#F5F5DC	245, 245, 220
OldLace	#FDF5E6	253, 245, 230
FloralWhite	#FFFAF0	255, 250, 240
Ivory	#FFFFF0	255, 255, 240
AntiqueWhite	#FAEBD7	250, 235, 215
Linen	#FAF0E6	250, 240, 230
LavenderBlush	#FFF0F5	255, 240, 245
MistyRose	#FFE4E1	255, 228, 225
Серые тона:
Gainsboro	#DCDCDC	220, 220, 220
LightGrey	#D3D3D3	211, 211, 211
LightGray	#D3D3D3	211, 211, 211
Silver	#C0C0C0	192, 192, 192
DarkGray	#A9A9A9	169, 169, 169
DarkGrey	#A9A9A9	169, 169, 169
Gray	#808080	128, 128, 128
Grey	#808080	128, 128, 128
DimGray	#696969	105, 105, 105
DimGrey	#696969	105, 105, 105
LightSlateGray	#778899	119, 136, 153
LightSlateGrey	#778899	119, 136, 153
SlateGray	#708090	112, 128, 144
SlateGrey	#708090	112, 128, 144
DarkSlateGray	#2F4F4F	47, 79, 79
DarkSlateGrey	#2F4F4F	47, 79, 79
Black	#000000	0, 0, 0

Посмотри внимательно на рисунок. Фон у выпадающего окошка сделан полупрозрачным. Это довольно частый дизайнерский прием. Давай подумаем, как это можно реализовать.

Задача

Сделать кроссбраузерный полупрозрачный цвет.

Решение

Первая мысль в данной ситуации — использовать для фона png24-картинку с уже заданной полупрозрачностью. Но эта картинка совершенно лишняя. Можно прекрасно обойтись и без нее (а значит без лишнего запроса к серверу). Давай все-таки попробуем найти оптимальное решение.

Вторая мысль — использовать . Но в данном случае это не очень удобно. Ведь полупрозрачным тогда станет не только фон, но и надписи. Да, собственно, все окошко сразу.

Конечно, можно попробовать добавить дополнительный контейнер и применять opacity только к нему, но этот HTML-элемент будет предназначен только для оформления и явно будет лишним. Можно ли обойтись без него?

Конечно можно! Если использовать RGBA.

Формат описания цвета RGBA

CSS3 позволяет задавать цвет, используя функции RGB и RGBA. При этом мы должны указать долю каждой цветовой составляющей, под которую отводится один байт (от 0 до 255, вдруг кто не знает).

Синтаксис у этого дела очень простой:

Background: rgb(0, 255, 0); /* чистый зеленый цвет */

Для RGBA добавляется четвертый параметр — альфапрозрачность (от 0 до 1).

Background: rgba(255, 0, 0, 0.5); /* чистый красный с прозрачностью 50% */

Вот оно, решение нашей задачки. Достаточно задать цвет фона с помощью rgba и все будет выглядеть как нам нужно. Без лишних картинок и элементов!

А где мне взять эти циферки?

Посмотреть на составляющие цвета можно используя инструмент фотошопа «пипетка»

О кроссбраузерности

Так как функция RGB значительно старше, чем RGBA и присутствует еще со времен стандарта CSS2, то для подстраховки от самых древних браузеров можно использовать такую дублирующую конструкцию:

SomeBlock { background: rgb(255, 0, 0); background: rgba(255, 0, 0, 0.5); }

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

Отдельно придется позаботиться об IE. Ослоподобные аж до 8-ой версии включительно не понимают RGBA.

Как всегда: землю — крестьянам, фабрики — рабочим, а ослам — костыль! В виде .

Само собой, в боевых условиях выносим это правило в отдельный CSS, который подключаем .

SomeBlock { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#80ff0000,endColorstr=#80ff0000); zoom: 1; }

Фишка в том, чтобы указать начальный и конечный цвета одинаковыми (ff0000 — красный) и воспользоваться тем, что для градиента в этом фильтре можно задать альфаканал (в примере значение 80).

Для справки: в фильтре используется шестнадцатеричная система и полностью непрозрачному цвету соответствует код FF (в десятичной это 255). Соответственно шестнадцатеричное 80 — это десятичное 128, т.е 50% прозрачности.

Проверено в:

IE 6-9
Firefox 3+
Opera 10+
Safari 4
Chrome

Для задания цветов используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из её названия, на числе 16. Цифры будут следующие: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе образуются объединением двух чисел в одно. Например, числу 255 в десятичной системе соответствует число FF в шестнадцатеричной системе. Чтобы не возникало путаницы в определении системы счисления, перед шестнадцатеричным числом ставят символ решетки #, например #666999. Каждый из трех цветов - красный, зеленый и синий - может принимать значения от 00 до FF. Таким образом, обозначение цвета разбивается на три составляющие #rrggbb, где первые два символа отмечают красную компоненту цвета, два средних - зеленую, а два последних - синюю. Допускается использовать сокращенную форму вида #rgb, где каждый символ следует удваивать. Так, запись #fe0 следует расценивать как #ffee00.

По названию

Internet Explorer	Chrome	Opera	Safari	Firefox	Android	iOS
4.0+	1.0+	3.5+	1.3+	1.0+	1.0+	1.0+

Браузеры поддерживают некоторые цвета по их названию. В табл. 1 приведены названия, шестнадцатеричный код, значения в формате RGB, HSL и описание.

Табл. 1. Названия цветов

Имя	Код	RGB	HSL	Описание
white	#ffffff или #fff	rgb(255,255,255)	hsl(0,0%,100%)	Белый
silver	#c0c0c0	rgb(192,192,192)	hsl(0,0%,75%)	Серый
gray	#808080	rgb(128,128,128)	hsl(0,0%,50%)	Темно-серый
black	#000000 или #000	rgb(0,0,0)	hsl(0,0%,0%)	Черный
maroon	#800000	rgb(128,0,0)	hsl(0,100%,25%)	Темно-красный
red	#ff0000 или #f00	rgb(255,0,0)	hsl(0,100%,50%)	Красный
orange	#ffa500	rgb(255,165,0)	hsl(38.8,100%,50%)	Оранжевый
yellow	#ffff00 или #ff0	rgb(255,255,0)	hsl(60,100%,50%)	Желтый
olive	#808000	rgb(128,128,0)	hsl(60,100%,25%)	Оливковый
lime	#00ff00 или #0f0	rgb(0,255,0)	hsl(120,100%,50%)	Светло-зеленый
green	#008000	rgb(0,128,0)	hsl(120,100%,25%)	Зеленый
aqua	#00ffff или #0ff	rgb(0,255,255)	hsl(180,100%,50%)	Голубой
blue	#0000ff или #00f	rgb(0,0,255)	hsl(240,100%,50%)	Синий
navy	#000080	rgb(0,0,128)	hsl(240,100%,25%)	Темно-синий
teal	#008080	rgb(0,128,128)	hsl(180,100%,25%)	Сине-зеленый
fuchsia	#ff00ff или #f0f	rgb(255,0,255)	hsl(300,100%,50%)	Розовый
purple	#800080	rgb(128,0,128)	hsl(300,100%,25%)	Фиолетовый

С помощью RGB

Internet Explorer	Chrome	Opera	Safari	Firefox	Android	iOS
5.0+	1.0+	3.5+	1.3+	1.0+	1.0+	1.0+

Можно определить цвет, используя значения красной, зеленой и синей составляющей в десятичном исчислении. Каждая из трех компонент цвета принимает значение от 0 до 255. Также допустимо задавать цвет в процентном отношении, при этом 100% будет соответствовать числу 255. Вначале указывается ключевое слово rgb , а затем в скобках, через запятую указываются компоненты цвета, например rgb(255, 128, 128) или rgb(100%, 50%, 50%).

RGBA

Internet Explorer	Chrome	Opera	Safari	Firefox	Android	iOS
9.0+	1.0+	10.0+	3.1+	3.0+	2.1+	2.0+

Формат RGBA похож по синтаксису на RGB, но включает в себя альфа-канал, задающий прозрачность элемента. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.

RGBA добавлен в CSS3, поэтому валидацию CSS-кода надо проводить именно по этой версии. Следует отметить, что стандарт CSS3 еще находится в разработке и некоторые возможности в нем могут поменяться. К примеру, цвет в формате RGB добавленный к свойству background-color проходит валидацию, а добавленный к свойству background уже нет. При этом браузеры вполне корректно понимают цвет для того и другого свойства.

HSL

Internet Explorer	Chrome	Opera	Safari	Firefox	Android	iOS
9.0+	1.0+	9.6+	3.1+	3.0+	2.1+	2.0+

Название формата HSL образовано от сочетания первых букв Hue (оттенок), Saturate (насыщенность) и Lightness (светлота). Оттенок это значение цвета на цветовом круге (рис. 1) и задаётся в градусах. 0° соответствует красному цвету, 120° - зелёному, а 240° - синему. Значение оттенка может изменяться от 0 до 359.

Рис. 1. Цветовой круг

Насыщенностью называется интенсивность цвета, измеряется в процентах от 0% до 100%. Значение 0% обозначает отсутствие цвета и оттенок серого, 100% максимальное значение насыщенности.

Светлота задает, насколько цвет яркий и указывается в процентах от 0% до 100%. Малые значения делают цвет темнее, а высокие светлее, крайние значения 0% и 100% соответствуют чёрному и белому цвету.

HSLA

Internet Explorer	Chrome	Opera	Safari	Firefox	Android	iOS
9.0+	1.0+	10.0+	3.1+	3.0+	2.1+	2.0+

Формат HSLA похож по синтаксису на HSL, но включает в себя альфа-канал, задающий прозрачность элемента. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.

Значения цвета в форматах RGBA, HSL и HSLA добавлены в CSS3, поэтому при использовании этих форматов проверяйте код на валидность с учётом версии.

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

Цвета

Предупреждение

Все перечисленные на сайте методы ловли льва являются теоретическими и базируются на вычислительных методах. Авторы не гарантируют вашей безопасности при их использовании и снимают с себя всякую ответственность за результат. Помните, лев это хищник и опасное животное!

Арррргх!

Результат данного примера показан на рис. 2.

Рис. 2. Цвета на веб-странице