Главная » Оргтехника » Серый css. Цветовые коды в Minecraft

Серый css. Цветовые коды в Minecraft

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

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

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

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

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

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

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

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

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

Пример :

#808080

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

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

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

background-color:rgb(100,186,43)

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

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

background-color:rgba(100,86,143,0.2)

background-color:rgba(100,86,143,0.5)

background-color:rgba(100,86,143,0.8)

background-color:rgba(100,86,143,1)

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

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

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

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

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

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

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

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

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

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

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

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

Эти данные полностью подтверждаются статистикой. Судя по ней, в 2014 году всего лишь 0.5% пользователей имеют компьютеры, поддерживающие лишь 256 оттенков.

Основы цветовой гармонии

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

В web-дизайне существует несколько способов представления цвета

HEX – шестнадцатеричная система представления цвета по основанию 16. Для данной системы используются арабские десятичные цифры от 0 до 9 и латинские буквы от A до F для дополнения цифрового количества до 16. Для web-дизайна взяты 16 основных (ключевых) цветов, так называемый шестнадцатеричный код цвета #RRGGBB, где каждая пара отвечает за свою долю цвета: RR – красный, GG – зеленый и BB – синий. Каждая доля цвета находится в диапазоне от 00 до FF.

Два других представления цвета в web-дизайне это: в виде RGB(*,*,*), где каждая «*» доля цвета представлена десятичными цифрами от 0 до 255 и по наименованиям цвета на английском языке.

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

Таблица 16 основных цветов , которые используются во всех браузерах


Название	Цвет	Hex	(RGB)
Aqua (морская волна)		#00FFFF	(000,255,255)
Black (черный)		#000000	(000,000,000)
Blue (голубой)		#0000FF	(000,000,255)
Fuchsia (фуксин)		#FF00FF	(255,000,255)
Gray (серый)		#808080	(128,128,128)
Green (зеленый)		#008000	(000,128,000)
Lime (ярко-зеленый)		#00FF00	(000,255,000)
Maroon (темно-бордовый)		#800000	(128,000,000)
Navy (темно-синий)		#000080	(000,000,128)
Olive (оливковый)		#808000	(128,128,000)
Purple (фиолетовый)		#800080	(128,000,128)
Red (красный)		#FF0000	(255,000,000)
Silver (серебряный)		#C0C0C0	(192,192,192)
Teal (серо-зеленый)		#008080	(000,128,128)
White (белый)		#FFFFFF	(255,255,255)
Yellow (желтый)		#FFFF00	(255,255,000)

Таблица пурпурного цвета и его оттенков

Название	Цвет	Hex	(RGB)
Magenta (пурпурный)		#FFCBDB	(255,203,219)
Magenta (пурпурный)		#FF0099	(255,000,153)
Magenta (маджента)		#F95A61	(249,090,097)
Fuchsia (фуксия)		#FF00FF	(255,000,255)
Мовеин (анилиновый пурпур)		#EF0097	(239,000,151)
Salmon pink (оранжево розовый)		#FF91A4	(255,145,164)
Cenise (оттенок пурпурного)		#DE3163	(153,149,140)
Aubergine Eggplant (баклажановый)		#990066	(153,000,132)
Lavender blush (розовато-лавандовый)		#FFF0F5	(255,240,245)
Lilac (сиреневый)		#C8A2C8	(200,162,200)
Magenta (маджента)		#FF008F	(255,000,143)
Orchid (орхидея)		#DA70D6	(218,112,214)
Red-violet (фиолетово-красный)		#C71585	(199,021,133)
Sanguine (сангиновый)		#92000A	(146,000,010)
Thistle (оттенок пурпурного)		#D8BFD8	(185,211,238)
Violet-eggplant (оттенок пурпурного)		#991199	(153,017,153)
Rosa vivo (насыщено розовый)		#FF007F	(255,000,127)
Lavender-rose (оттенок пурпурного)		#FBA0E3	(108,123,139)
Mountbatten pink (розовый Маунбаттена)		#997ABD	(153,122,141)

Таблица серого цвета и его оттенков

Название	Цвет	Hex	(RGB)
Gray (Серый)		#808080	(128,128,128)
Gray (Серый)		#bebebe	(190,190,190)
(Серый-оттенок)		#858585	(133,133,133)
Gray33 (Серый-33)		#545454	(084,084,084)
(Серого шифера)		#708090	(112,128,144)
(Кварцевый)		#99958с	(153,149,140)
(Светло-серый)		#bbbbbb	(187,187,187)
(Серебристый)		#c0c0c0	(192,192,192)
(Серо-белый)		#f0f0f0	(240,240,240)
(Бороды Абдель-Керима)		#e0e0e0	(224,224,224)
LightGray (Серый светлый)		#d3d3d3	(211,211,211)
LightStateGray ()		#778899	(119,136,153)
StateGray-1 (Бледно-васильковый1)		#c6e2ff	(198,226,255)
StateGray-2 (Бледно-васильковый2)		#b9d3ee	(185,211,238)
StateGray3 ()		#9fb6cd	(159,182,205)
StateGray4 ()		#6c7b8b	(108,123,139)

Таблица «безопасных» цветов в CSS

#000000

#000033

#000066

#000099

#0000CC

#0000FF

#003300

#003333

#003366

#003399

#0033CC

#0033FF

#006600

#006633

#006666

#006699

#0066CC

#0066FF

#009900

#009933

#009966

#009999

#0099CC

#0099FF

#00CC00

#00CC33

#00CC66

#00CC99

#00CCCC

#00CCFF

#00FF00

#00FF33

#00FF66

#00FF99

#00FFCC

#00FFFF

#330000

#330033

#330066

#330099

#3300CC

#3300FF

#333300

#333333

#333366

#333399

#3333CC

#3333FF

#336600

#336633

#336666

#336699

#3366CC

#3366FF

#339900

#339933

#339966

#339999

#3399CC

#3399FF

#33CC00

#33CC33

#33CC66

#33CC99

#33CCCC

#33CCFF

#33FF00

#33FF33

#33FF66

#33FF99

#33FFCC

#33FFFF

#660000

#660033

#660066

#660099

#6600CC

#6600FF

#663300

#663333

#663366

#663399

#6633CC

#6633FF

#666600

#666633

#666666

#666699

#6666CC

#6666FF

#669900

#669933

#669966

#669999

#6699CC

#6699FF

#66CC00

#66CC33

#66CC66

#66CC99

#66CCCC

#66CCFF

#66FF00

#66FF33

#66FF66

#66FF99

#66FFCC

#66FFFF

#990000

#990033

#990066

#990099

#9900CC

#9900FF

#993300

#993333

#993366

#993399

#9933CC

#9933FF

#996600

#996633

#996666

#996699

#9966CC

#9966FF

#999900

#999933

#999966

#999999

#9999CC

#9999FF

#99CC00

#99CC33

#99CC66

#99CC99

#99CCCC

#99CCFF

#99FF00

#99FF33

#99FF66

#99FF99

#99FFCC

#99FFFF

#CC0000

#CC0033

#CC0066

#CC0099

#CC00CC

#CC00FF

#CC3300

#CC3333

#CC3366

#CC3399

#CC33CC

#CC33FF

#CC6600

#CC6633

#CC6666

#CC6699

#CC66CC

#CC66FF

#CC9900

#CC9933

#CC9966

#CC9999

#CC99CC

#CC99FF

#CCCC00

#CCCC33

#CCCC66

#CCCC99

#CCCCCC

#CCCCFF

#CCFF00

#CCFF33

#CCFF66

#CCFF99

#CCFFCC

#CCFFFF

#FF0000

#FF0033

#FF0066

#FF0099

#FF00CC

#FF00FF

#FF3300

#FF3333

#FF3366

#FF3399

#FF33CC

#FF33FF

#FF6600

#FF6633

#FF6666

#FF6699

#FF66CC

#FF66FF

#FF9900

#FF9933

#FF9966

#FF9999

#FF99CC

#FF99FF

#FFCC00

#FFCC33

#FFCC66

#FFCC99

#FFCCCC

#FFCCFF

#FFFF00

#FFFF33

#FFFF66

#FFFF99

#FFFFCC

#FFFFFF

Цвет в языке CSS можно задавать разными способами:

по названию,
по шестнадцатеричному значению,
в форматах RGB и RGBA,
в форматах HSL и HSLA.

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

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

Табл. 1. Названия цветов, их RGB, HEX и HSL код.

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

Это образец использования имен цветов, навзания цветов взяты из расширеной таблицы.

MediumTurquoise

brown

crimson

blueviolet

rolivedrab

Вот как работает этот код:

Установка цвета с помощью RGB

RGB - аддитивная цветовая модель. На английском языке addition - добавление. RGB - это аббревиатура английских слов: Red, Green, Blue - красный, зелёный, синий). Из этого понятно что в модели RGB цвета синтезируются путём добавления трёх цветов (красного, зелёного, синего) в различных количествах.

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

Ближе к делу.

Для установки свойств в этом формате используется запись rgb(r, g, b) , где r, g, b - это три канала для каждого цвета (red, green, blue). Значения для каждого канала задаются в диапазоне от 0 до 255.

Пример кода.

Чтобы всё стало понятно, приведу пример кода:

rgb(255, 0, 0)

rgb(0, 255, 0)

rgb(0, 0, 255)

Вот так должен сработать этот пример:

Рис.1. Цвета в RGB.

Пояснения к примеру.

В начале страницы создаём класс div.rgb , он нужен чтобы блоки созданные тегом

отображались нужным размером: 240px на 40px . Свойству line-height (высота строки) присваиваем значение - 40px , то есть равное высоте блока, это позволит отображать текст в блоке

по центру вертикали. по горизонтали текст центрируем при помощи правила {text-align : center ;} .

Далее, в коде устанавливаем фоновый цвет блока

при момощи атрибута style успользуя свойство background , а значения присваиваем rgb(255, 0, 0) , rgb(0, 255, 0) , и rgb(0, 0, 255) . То есть, мы поочерёдно делаем один канал максимально насыщенным, а остальные каналы не используются для синтеза, так как их значение равно нолю.

Попробуйте отредактировать этот пример и указать свои значения, например rgb(100, 100, 100) .

Установка цвета с помощью RGBA

В CSS3 появился новый инструмент для работы с цветом - формат RGBA. Его можно назвать развитием модели RGB, но с добавлением одного нового канала - A или альфа-канала. Этот канал устанавливает прозрачность цвета. Его значения задаются в диапазоне от 0 до 1. Значение равное 0 соответствует полной прозрачности, 1 - полной непрозрачности (цвет будет таким, каким он задан в первых трёх каналах RGB), а промежуточные значения, как 0.4 или 0.6 - полупрозрачности в различной степени.

Пример кода.

Вот как он сработает:

Этот код по своему визуальному представлению аналогичен следующему, использующему модель RGB для задания значения цвета:

Вот его результат:

Значение альфа канала равное нолю делает любой цвет невидимым - абсолютно прозрачным, значение равное единице транслирует цвет в RGB-коде без изменений. Свойство rgba(255,0,0,1.0) показывает красный цвет rgb(255, 0, 0) .

По шестнадцатеричному значению (HEX-код)

В повсежневной жизни мы пользуемся десятичной системой счёта. Её истоки очень просты - у нас десять пальцев на руках, и считать по пальцам в жизни бывало удобно. Если в десятичной системе десять цифр: от 0 до 9, а число 10 - это уже следующий разряд, то в шестнадцатеричная система счисления 16 цифр, а следующим разрядом будет число 16.

Для указания кодов цветов в качестве шестнадцатеричных цифр используются обычные десятичные цифры от 0 до 9 и для обозначения цифр от 10 до 15 используют латинские буквы от A до F то есть (0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F). Для наглядности сведём это в таблицу:

Для записи шестнадцатеричных чисел больше F (15 по десятичной системе), как и в десятичной системе, также используют объединение двух цифр, но уже шестнадцатеричных, что очевидно. Так, для записи десятичного числа 255 в шестнадцатеричной системе используется запись FF.

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

Чтобы указать цвет в 16-ричной системе, перед числовым значением нужно ставить знак «#», пример: #FFC0CB . Само значение #FFC0CB состоит из трёх шестнадцатеричных цифр FF , C0 и CB . Смысл этой записи такой же, как и установка цвета в формате RGB (rgb(r, g, b) ) - каждая шестнадцатиричная цифра в HEX-коде указывает насыщение цвета в своём канале модели RGB.

#FF0000

#00FF00

#0000FF

Этот код отобразит следующие элементы:

А вот рисунок с результатом из раздела "Установка цвета с помощью RGB" на этой странице выше.

Рис.1. Цвета в RGB.

Мы видим что цвета идентичны.

Допускается сокращенная запись HEX-кода цвета: 6-значное число можно записать как 3-значное. Это допустимо только в случае, когда две цифры в значении цвета одного канала повторяются.

То есть допустимо следующее сокращение записи:

Например, цвет #ff22aa допустимо написать так - #f2a , или цвет #44aa22 допустимо указать в виде #4a2 .

Установка цвета с помощью HSL

В CSS3 появился новый формат для указания цвета.

Формат HSL - это аббревиатура от английских слов: Hue (оттенок), Saturate (насыщенность) и Lightness (светлота).

Оттенок в HSL - это значение цвета на специальном цветовом круге (рисунок 2) и оно задаётся в градусах. Если проводить аналогии с моделью RGB, то 0° соответствует красному, 120° соответствует зелёному, а 240° - синему цвету.

Значение оттенка изменятся в диапазоне от 0 до 359.

Рисунок 2. Цветовой круг HSL.

Второе значение - насыщенность (Saturate) задаётся в процентах. При 100% насыщенности цвет максимально "сочный", по мере движения показателя насыщеннсоти к 0%, цвет становится всё более тусклым и скатывается в серый.

Третье значение - светлота (Lightness) также задаётся в процентах. Чем выше процент, тем более яркий будет цвет. Крайние значения 0% и 100% будут обозначать соответственно чёрный (отсутствие света) и белый (засвеченный) цвета, при этом неважно, какой цвет из цветового круга был выбран в первом канале. Оптимальным можно считать значение яркости цвета равное 50%.

Установка цвета с помощью HSLA

Формат HSLA соотносится с HSL, так же как и RGB с RGBA. В формате HSLA, как и в RGBA добавлен альфа-канал отвечающий за прозрачность цвета.

Цвет, заданный в формате HSL, читать более просто. Можно сказать что он интуитивно понятен. Например, код hsl(120,60%,50%) можно представить итоговый цвет, если в памяти есть картинка цветового круга HSL. Про форматы RGB и HEX такого сказать нельзя, код цвета заданный в этих форматах становится понятный только после его визуализации на мониторе.

Новые форматы в CSS3 (HSL, HSLA и RGBA) работают в браузерах начиная с версий: IE 9.0, Opera 10.0 Firefox 3.0. Как сделать так, чтобы стили работали на старых браузерах?

Somebloсk { background-color: rgb(255,50,50); background-color: rgba(255,50,50,0.85) }

При использовании такого кода в старых браузерах фоновый цвет для класса .somebloсk хоть и не будет использовать альфа-канал, но будет отображаться в формате RGB.

В 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(127, 255, 127) и rgb(50%, 100%, 50%) будут задавать одинаковый зеленый цвет средней насыщенности:

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

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

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

rgb(127, 255, 127)

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 в шестнадцатеричной системе. В отличие десятичной системы, перед шестнадцатеричным числом ставят символ решетки # , например, #FF0000 отображается как красный цвет, так как красный устанавливается в его самое высокое значение (FF), а остальным цветам установлено минимальное значение (00). Знаки после символа решетки # можно набирать как прописными, так и строчными. Шестнадцатеричная система позволяет использовать сокращенную форму вида #rgb, где каждый символ равнозначен удвоенному. Так, запись #f7O следует расценивать как #ff7700.

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

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

красный: #FF0000

зеленый: #00FF00

синий: #0000FF

красный: #FF0000

зеленый: #00FF00

синий: #0000FF

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

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

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

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

Английское название	Русское название	HEX	RGB
Amaranth	Амарантовый	#E52B50	229	43	80
Amber	Янтарный	#FFBF00	255	191	0
Aqua	Сине-зеленый	#00FFFF	0	255	255
Azure	Лазурный	#007FFF	0	127	255
Black	Черный	#000000	0	0	0
Blue	Синий	#0000FF	0	0	255
Bondi Blue	Вода пляжа Бонди	#0095B6	0	149	182
Brass	Латунный	#B5A642	181	166	66
Brown	Коричневый	#964B00	150	75	0
Cerulean	Лазурный	#007BA7	0	123	167
Dark spring green	Тёмный весенне-зелёный	#177245	23	114	69
Emerald	Изумрудный	#50C878	80	200	120
Eggplant	Баклажановый	#990066	153	0	102
Fuchsia	Фуксия	#FF00FF	255	0	255
Gold	Золотой	#FFD700	250	215	0
Gray	Серый	#808080	128	128	128
Green	Зелёный	#00FF00	0	255	0
Indigo	Индиго	#4B0082	75	0	130
Jade	Нефритовый	#00A86B	0	168	107
Lime	Лайм	#CCFF00	204	255	0
Malachite	Малахитовый	#0BDA51	11	218	81
Navy	Тёмно-синий	#000080	0	0	128
Ochre	Охра	#CC7722	204	119	34
Olive	Оливковый	#808000	128	128	0
Orange	Оранжевый	#FFA500	255	165	0
Peach	Персиковый	#FFE5B4	255	229	180
Pumpkin	Тыква	#FF7518	255	117	24
Purple	Фиолетовый	#800080	128	0	128
Red	Красный	#FF0000	255	0	0
Saffron	Шафрановый	#F4C430	244	196	48
Sea Green	Зелёное море	#2E8B57	46	139	87
Swamp green	Болотный	#ACB78E	172	183	142
Teal	Сине-зелёный	#008080	0	128	128
Ultramarine	Ультрамариновый	#120A8F	18	10	143
Violet	Фиолетовый	#8B00FF	139	0	255
Yellow	Жёлтый	#FFFF00	255	255	0

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

Напечатать

или

Серый css. Цветовые коды в Minecraft

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

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

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

Основы цветовой гармонии

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

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

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

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

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

В web-дизайне существует несколько способов представления цвета

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

Установка цвета с помощью RGB

Установка цвета с помощью RGBA

По шестнадцатеричному значению (HEX-код)

Установка цвета с помощью HSL

Установка цвета с помощью HSLA

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

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

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

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

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

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

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

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

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

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

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

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

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

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

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

красный: #FF0000

зеленый: #00FF00

синий: #0000FF

красный: #FF0000

зеленый: #00FF00

синий: #0000FF

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

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

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

Похожие записи: