В HTML цвет можно задавать тремя способами:

Задание цвета в HTML по его названию

Некоторые цвета можно задавать по их названию, используя в качестве значения название цвета на английском языке. Самые распространенные ключевые слова: black (черный), white (белый), red (красный), green (зеленый), blue (синий) и др:

Цвет текста – красный

Наиболее популярные цвета стандарта Консорциума Всемирной паутины (англ. World Wide Web Consortium, W3C):

Цвет	Название	Цвет	Название	Цвет	Название	Цвет	Название
	Black		Gray		Silver		White
	Yellow		Lime		Aqua		Fuchsia
	Red		Green		Blue		Purple
	Maroon		Olive		Navy		Teal

Пример использования различных цветовых названий:

Пример: задание цвета по его названию

• Попробуй сам »

Заголовок на красном фоне

Заголовок на оранжевом фоне

Заголовок на фоне лайм

Белый текст на синем фоне

Заголовок на красном фоне

Заголовок на оранжевом фоне

Заголовок на фоне лайм

Белый текст на синем фоне

Задание цвета с помощью RGB

При отображении различных цветов на мониторе за основу берется RGB-палитра. Любой цвет получают, смешивая три основных: R — красный (red) , G — зеленый (green) , В — синий (blue) . Яркость каждого цвета задается одним байтом и, следовательно, может принимать значения от 0 до 255. Например, RGB (255,0,0) отображается как красный, так как красный устанавливается в его самое высокое значение (255), а остальные установлены в 0. Также можно задавать цвет в процентном отношении. Каждый из параметров обозначает уровень яркости соответствующего цвета. Например: значения rgb(109,0,109) и rgb(50%, 100%, 50%) будут задавать одинаковый зеленый цвет средней насыщенности:

Пример: Задание цвета с помощью RGB

• Попробуй сам »

rgb(109,0,109)

rgb(50%, 100%, 50%)

rgb(109,0,109)

rgb(50%, 100%, 50%)

Задание цвета по шестнадцатеричному значению

Значения R G B также могут быть указаны с помощью шестнадцатеричных (HEX) значений цвета в форме: #RRGGBB, где RR (красный), GG (зеленый) и BB (синий) являются шестнадцатеричными значениями от 00 до FF (так же, как десятичное 0-255). Шестнадцатеричная система, в отличие десятичной системы, базируется, как следует из ее названия, на числе 16. Шестнадцатеричная система использует следующие знаки: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, А, В, С, D, E, F. Здесь цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе представляют из себя объединением двух знаков в одно значение. Например, наибольшему числу 255 в десятичной системе соответствует самое высокое значение FF в шестнадцатеричной системе. В отличие десятичной системы, перед шестнадцатеричным числом ставят символ решетки # , например, #00ecec отображается как красный цвет, так как красный устанавливается в его самое высокое значение (FF), а остальным цветам установлено минимальное значение (00). Знаки после символа решетки # можно набирать как прописными, так и строчными. Шестнадцатеричная система позволяет использовать сокращенную форму вида #rgb, где каждый символ равнозначен удвоенному. Так, запись #f7O следует расценивать как #0075ec.

Пример: Цвет HEX

• Попробуй сам »

красный: #00ecec

зеленый: #ec00ec

синий: #ecec00

красный: #00ecec

зеленый: #ec00ec

синий: #ecec00

красный+зеленый=желтый: #0000ec

красный+синий=фиолетовый: #00ec00

зеленый+синий=голубой: #ec0000

Список широко распространённых цветов (название, HEX и RGB):

Английское название	Русское название	Образец	HEX	RGB
Amaranth	Амарантовый		#07c19c	229	43	80
Amber	Янтарный		#002dec	255	191	0
Aqua	Сине-зеленый		#ec0000	0	255	255
Azure	Лазурный		#ec6d00	0	127	255
Black	Черный		#ececec	0	0	0
Blue	Синий		#ecec00	0	0	255
Bondi Blue	Вода пляжа Бонди		#ec5736	0	149	182
Brass	Латунный		#3746aa	181	166	66
Brown	Коричневый		#56a1ec	150	75	0
Cerulean	Лазурный		#ec7145	0	123	167
Dark spring green	Тёмный весенне-зелёный		#d57aa7	23	114	69
Emerald	Изумрудный		#9c2474	80	200	120
Eggplant	Баклажановый		#53ec86	153	0	102
Fuchsia	Фуксия		#00ec00	255	0	255
Gold	Золотой		#0015ec	250	215	0
Gray	Серый		#6c6c6c	128	128	128
Green	Зелёный		#ec00ec	0	255	0
Indigo	Индиго		#a1ec6a	75	0	130
Jade	Нефритовый		#ec4481	0	168	107
Lime	Лайм		#2000ec	204	255	0
Malachite	Малахитовый		#e1129b	11	218	81
Navy	Тёмно-синий		#ecec6c	0	0	128
Ochre	Охра		#2075ca	204	119	34
Olive	Оливковый		#6c6cec	128	128	0
Orange	Оранжевый		#0047ec	255	165	0
Peach	Персиковый		#000738	255	229	180
Pumpkin	Тыква		#0077d4	255	117	24
Purple	Фиолетовый		#6cec6c	128	0	128
Red	Красный		#00ecec	255	0	0
Saffron	Шафрановый		#0028bc	244	196	48
Sea Green	Зелёное море		#be6195	46	139	87
Swamp green	Болотный		#40355e	172	183	142
Teal	Сине-зелёный		#ec6c6c	0	128	128
Ultramarine	Ультрамариновый		#dae25d	18	10	143
Violet	Фиолетовый		#61ec00	139	0	255
Yellow	Жёлтый		#0000ec	255	255	0

Коды цветов (фон) по насыщенности и оттенку.

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

Вы можете задать свои значения цвета в различных форматах. В следующей таблице перечислены все возможные форматы:

Ниже более подробно описаны перечисленные форматы.

Цвета CSS - шестнадцатеричные коды

Шестнадцатеричный код цвета - это шестизначное представление цвета. Первые две цифры (RR) - представляют собой красное значение, следующие две - это зеленое значение (GG), а последние - синее значение (BB).

Цвета CSS - короткие шестнадцатеричные коды

Короткий шестнадцатеричный код цвета - это более короткая форма шестизначной нотации. В этом формате каждая цифра повторяется, чтобы получить эквивалентное шестизначное значение цвета. Например: #ec00ec становится #ec00ec.

Шестнадцатеричное значение может быть взято из любого графического программного обеспечения, такого как Adobe Photoshop, Core Draw и др.

Каждому шестнадцатеричному коду цвета в CSS будет предшествовать знак хеша «#». Ниже приведены примеры использования шестнадцатеричных обозначений.

Цвета CSS - RGB значения

RGB значение - это код цвета, который задается с помощью свойства rgb(). Это свойство принимает три значения: по одному для красного, зеленого и синего. Значение может быть целым числом, от 0 до 255, или процентом.

Примечание: не все браузеры поддерживают свойство rgb() цвета, поэтому не рекомендуется его использовать.

Ниже приведен пример, показывающий несколько цветов с использованием значений RGB.

Генератор цветовых кодов

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

Безопасные цвета браузера

Ниже представлена таблица из 216 цветов, которые наиболее безопасные и независимые от компьютера. Эти цвета в CSS варьируются от 000000 до FFFFFF шестнадцатеричного кода. Они безопасны в использовании, поскольку гарантируют, что все компьютеры будут правильно отображать цвет при работе с 256 цветовой палитрой.

Таблица «безопасных» цветов в CSS
#ececec	#ececb9	#ecec86	#ecec53	#ecec20	#ecec00
#ecb9ec	#ecb9b9	#ecb986	#ecb953	#ecb920	#ecb900
#ec86ec	#ec86b9	#ec8686	#ec8653	#ec8620	#ec8600
#ec53ec	#ec53b9	#ec5386	#ec5353	#ec5320	#ec5300
#ec20ec	#ec20b9	#ec2086	#ec2053	#ec2020	#ec2000
#ec00ec	#ec00b9	#ec0086	#ec0053	#ec0020	#ec0000
#b9ecec	#b9ecb9	#b9ec86	#b9ec53	#b9ec20	#b9ec00
#b9b9ec	#b9b9b9	#b9b986	#b9b953	#b9b920	#b9b900
#b986ec	#b986b9	#b98686	#b98653	#b98620	#b98600
#b953ec	#b953b9	#b95386	#b95353	#b95320	#b95300
#b920ec	#b920b9	#b92086	#b92053	#b92020	#b92000
#b900ec	#b900b9	#b90086	#b90053	#b90020	#b90000
#86ecec	#86ecb9	#86ec86	#86ec53	#86ec20	#86ec00
#86b9ec	#86b9b9	#86b986	#86b953	#86b920	#86b900
#8686ec	#8686b9	#868686	#868653	#868620	#868600
#8653ec	#8653b9	#865386	#865353	#865320	#865300
#8620ec	#8620b9	#862086	#862053	#862020	#862000
#8600ec	#8600b9	#860086	#860053	#860020	#860000
#53ecec	#53ecb9	#53ec86	#53ec53	#53ec20	#53ec00
#53b9ec	#53b9b9	#53b986	#53b953	#53b920	#53b900
#5386ec	#5386b9	#538686	#538653	#538620	#538600
#5353ec	#5353b9	#535386	#535353	#535320	#535300
#5320ec	#5320b9	#532086	#532053	#532020	#532000
#5300ec	#5300b9	#530086	#530053	#530020	#530000
#20ecec	#20ecb9	#20ec86	#20ec53	#20ec20	#20ec00
#20b9ec	#20b9b9	#20b986	#20b953	#20b920	#20b900
#2086ec	#2086b9	#208686	#208653	#208620	#208600
#2053ec	#2053b9	#205386	#205353	#205320	#205300
#2020ec	#2020b9	#202086	#202053	#202020	#202000
#2000ec	#2000b9	#200086	#200053	#200020	#200000
#00ecec	#00ecb9	#00ec86	#00ec53	#00ec20	#00ec00
#00b9ec	#00b9b9	#00b986	#00b953	#00b920	#00b900
#0086ec	#0086b9	#008686	#008653	#008620	#008600
#0053ec	#0053b9	#005386	#005353	#005320	#005300
#0020ec	#0020b9	#002086	#002053	#002020	#002000
#0000ec	#0000b9	#000086	#000053	#000020	#000000

Влад Мержевич

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

Шестнадцатеричные цвета

Для задания цветов в HTML используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из ее названия, на числе 16. Цифры будут следующие: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Числа от 10 до 15 заменены латинскими буквами. В табл. 6.1 приведено соответствие десятичных и шестнадцатеричных чисел.

Числа больше 15 в шестнадцатеричной системе образуются объединением двух чисел в одно (табл. 6.2). Например, числу 255 в десятичной системе соответствует число FF в шестнадцатеричной.

Чтобы не возникало путаницы в определении системы счисления, перед шестнадцатеричным числом ставится символ решетки #, например #428320. При этом регистр значения не имеет, поэтому допустимо писать #000000 или #000000.

Типичный цвет, используемый в HTML, выглядит следующим образом.

Здесь цвет фона веб-страницы задан как #005ea5. Символ решетки # перед числом означает, что оно шестнадцатеричное. Первые две цифры (FA) определяют красную составляющую цвета, цифры с третьей по четвертую (8E) — зеленую, а последние две цифры (47) — синюю. В итоге получится такой цвет.

FA

+

8E

+

47

=

FA8E47

Каждый из трех цветов — красный, зеленый и синий — может принимать значения от 00 до FF, что в итоге образует 256 оттенков. Таким образом, общее количество цветов может быть 256х256х256 = 16.777.216 комбинаций. Цветовая модель, основанная на красной, зеленой и синей составляющей получила название RGB (red, green, blue; красный, зеленый, синий). Эта модель аддитивная (от add — складывать), при которой сложение всех трех компонент образует белый цвет.

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

• Если значения компонент цвета одинаковы (например: #161616), то получится серый оттенок. Чем больше число, тем светлее цвет, значения при этом меняются от #ececec (черный) до #000000 (белый).
• Ярко-красный цвет образуется, если красный компонент сделать максимальным (FF), а остальные компоненты обнулить. Цвет со значением #00ecec самый красный из возможных красных оттенков. Аналогично обстоит с зеленым цветом (#ec00ec) и синим (#ecec00).
• Желтый цвет (#0000ec) получается смешением красного с зеленым. Это хорошо видно на цветовом круге (рис. 6.1), где представлены основные цвета (красный, зеленый, синий) и комплементарные или дополнительные. К ним относятся желтый, голубой и фиолетовый (еще называемым пурпурным). Вообще, любой цвет можно получить смешением близлежащих к нему цветов. Так, голубой (#ec0000) получается за счет объединения синего и зеленого цвета.

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

Цвета по шестнадцатеричным значениям не обязательно подбирать эмпирическим путем. Для этой цели подойдет графический редактор, умеющий работать с разными цветовыми моделями, например, Adobe Photoshop. На рис. 6.2 показано окно для выбора цвета в этой программе, линией обведено полученное шестнадцатеричное значение текущего цвета. Его можно скопировать и вставить к себе в код.

Рис. 6.2. Окно для выбора цвета в программе Photoshop

Веб-цвета

Если установить качество цветопередачи монитора в 8 бит (256 цветов), то один и тот же цвет может показываться в разных браузерах по-своему. Это связано со способом отображения графики, когда браузер работает со своей собственной палитрой и не может показать цвет, который у него в палитре отсутствует. В этом случае цвет заменяется сочетанием пикселов других, близких к нему, цветов, имитирующих заданный. Чтобы цвет оставался неизменным в разных браузерах, ввели палитру так называемых веб-цветов. Веб-цветами называются такие цвета, для каждой составляющей которых - красной, зеленой и синей - устанавливается одно из шести значений - 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC), 255 (FF). В скобках указано шестнадцатеричное значение данной компоненты. Общее количество цветов из всех возможных сочетаний дает 6х6х6 - 216 цветов. Пример веб-цвета - #b90086.

Основная особенность веб-цвета заключается в том, что он показывается одинаково во всех браузерах. В данный момент актуальность веб-цветов весьма мала из-за повышения качества мониторов и расширения их возможностей.

Цвета по названию

Чтобы не запоминать совокупность цифр, вместо них можно использовать имена широко используемых цветов. В табл. 6.3 приведены имена популярных названий цветов.

Табл. 6.3. Названия некоторых цветов

Имя цвета	Цвет	Описание	Шестнадцатеричное значение
black		Черный	#ececec
blue		Синий	#ecec00
fuchsia		Светло-фиолетовый	#00ec00
gray		Темно-серый	#6c6c6c
green		Зеленый	#ec6cec
lime		Светло-зеленый	#ec00ec
maroon		Темно-красный	#6cecec
navy		Темно-синий	#ecec6c
olive		Оливковый	#6c6cec
purple		Темно-фиолетовый	#6cec6c
red		Красный	#00ecec
silver		Светло-серый	#2c2c2c
teal		Сине-зеленый	#ec6c6c
white		Белый	#000000
yellow		Желтый	#0000ec

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

Пример 6.1. Цвет фона и текста

Пример текста

В данном примере цвет фона задается с помощью атрибута bgcolor тега , а цвет текста через атрибут text . Для разнообразия значение у атрибута text установлено в виде шестнадцатеричного числа, а у bgcolor с помощью зарезервированного ключевого слова teal .

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

По названию

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		#000000 или #000000	rgb(0,0,0)	hsl(0,0%,100%)	Белый
silver		#2c2c2c	rgb(44,44,44)	hsl(0,0%,75%)	Серый
gray		#6c6c6c	rgb(108,108,108)	hsl(0,0%,50%)	Темно-серый
black		#ececec или #ececec	rgb(236,236,236)	hsl(0,0%,0%)	Черный
maroon		#6cecec	rgb(108,236,236)	hsl(0,100%,25%)	Темно-красный
red		#00ecec или #00ecec	rgb(0,236,236)	hsl(0,100%,50%)	Красный
orange		#0047ec	rgb(0,71,236)	hsl(38.8,100%,50%)	Оранжевый
yellow		#0000ec или #0000ec	rgb(0,0,236)	hsl(60,100%,50%)	Желтый
olive		#6c6cec	rgb(108,108,236)	hsl(60,100%,25%)	Оливковый
lime		#ec00ec или #ec00ec	rgb(236,0,236)	hsl(120,100%,50%)	Светло-зеленый
green		#ec6cec	rgb(236,108,236)	hsl(120,100%,25%)	Зеленый
aqua		#ec0000 или #ec0000	rgb(236,0,0)	hsl(180,100%,50%)	Голубой
blue		#ecec00 или #ecec00	rgb(236,236,0)	hsl(240,100%,50%)	Синий
navy		#ecec6c	rgb(236,236,108)	hsl(240,100%,25%)	Темно-синий
teal		#ec6c6c	rgb(236,108,108)	hsl(180,100%,25%)	Сине-зеленый
fuchsia		#00ec00 или #00ec00	rgb(0,236,0)	hsl(300,100%,50%)	Розовый
purple		#6cec6c	rgb(108,236,108)	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(0,108,108) или 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. Цвета на веб-странице

28.11.14 11.1K

К сожалению, вкусовые ощущения на сайте отобразить пока невозможно. Но это можно сполна компенсировать с помощью цветовой гаммы. Ведь цвета html позволяют отобразить любой из миллионов оттенков. Так что «цветных карандашей » в его наборе намного больше, чем семь.

Цветовая гамма в html

В html цвет может быть задан в нескольких форматах:

1. В виде шестнадцатеричного значения – используются код, заданный в шестнадцатеричной системе исчисления. Такие коды цветов в html состоят из трех пар шестнадцатеричных чисел. Каждая пара отвечает за насыщенность оттенка своим основным цветом:

• Первая числовая пара – отвечает за красный цвет;
• Вторая пара – за содержание зеленого цвета;
• Последняя – за содержание синего цвета.

В начале кода (перед цифрами ) ставится решетка. Так обозначается шестнадцатеричный цветовой код. Кроме чисел от 1 до 9 в этой системе исчисления используются буквы латинского алфавита (A, B, C, D, E, F).

Например, код белого цвета в html будет иметь вид #000000 :

2. Ключевым словом – сейчас html поддерживает около 147 ключевых слов. Но не все из этих слов являются уникальными. Некоторые из них ссылаются на один и тот же цветовой оттенок.

Серый цвет обозначается двумя ключевыми словами: grey и gray . Их шестнадцатеричный код (HEX ) задается одним и тем же значением #6c6c6c .

Пример :

#6c6c6c

3. В формате RGB – эта кодировка цветов в html основана на использовании трех значений, задаваемых в диапазоне от 0 до 255. Каждое из них определяет насыщенность оттенка одним из основных цветов:

• R – красный (red );
• G – зеленый (green );
• B – синий (blue ).

Номер цвета в формате RGB записывается в таком виде: rgb(236,26,136).

background-color:rgb(136,50,193)

4. В формате RGBA – он представляет собой усовершенствованный формат RGB , где четвертым значением задается прозрачность цвета в виде десятичной дроби от 0 до 1.

Пример использования:

background-color:rgba(136,150,93,0.2)

background-color:rgba(136,150,93,0.5)

background-color:rgba(136,150,93,0.8)

background-color:rgba(136,150,93,1)

Таблицы цветов html и генераторы цвета

При таком большом разбросе форматов установки цвета легко запутаться. Поэтому была придумана специальная таблица цветов. В ней к 147 ключевым названиям цветовых оттенков приведены коды соответствия во всех основных стандартах представления цвета. Дополнительно каждое поле снабжено планкой для визуального подбора цвета. Одна из таких таблиц представлена на сайте colorscheme.ru :

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

Чтобы обойти эту преграду и максимально упростить подбор нужного оттенка, были разработаны интерактивные веб-сервисы. Их пользовательский интерфейс может несколько разниться между собой.

На сайте html-color-codes.info генератор цветов имеет такой вид:

А в рамках сервиса color-picker.appsmaster.co этот инструмент реализован немного иначе:

Насыщенность каждого цвета в генераторе задается с помощью специальных ползунков. Визуально оттенок отображается цветом рамки и прямоугольника с левой стороны. Внизу в 3 полях отображается цветовой код в основных форматах.

Но генератор цветов доступен не только на специализированных сайтах. Подобным инструментом снабжены почти все графические редакторы. Например, Photoshop :

Техника безопасности при работе с цветом

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

Тогда была выведена великая таблица безопасных цветов. В ней указывалось 216 оттенков, которые могли быть отображены без искажения в любом из браузеров того времени. И по сей день эта «великая рукопись » еще доступна на некоторых ресурсах:

В наше время все изменилось. Поэтому все правила техники безопасности при работе с цветом в html полностью аннулируются. Ведь современное компьютерное железо поддерживает более 16 миллионов различных оттенков. И 216 безопасных цветов канули в лету.