Содержание

Как использовать цветовые коды для цветов. Учeбник HTML

Цвета HTML
HTML цвета и способы их указания

В языке HTML, существует два способа указать цвет:

1. С помощью имени цвета,
2. С помощью системы RGB, где цвета заданы в шестнадцатеричном формате.

Имя цвета

Имя цвета в HTML указывается английскими словами, например red или green . Имя цвета выступает в качестве значения атрибута HTML-тега. Имён цветов очень много, в этой статье мы рассмотрим лишь основные из них.

Обычно для задания цвета, в языке HTML используют два атрибута:

1. Атрибут color=»имя_цвета» — цвет текста,
2. Атрибут bgcolor=»имя_цвета» — цвет фона.

Примеры использования цветовых атрибутов:
color=»red» — назначаем тексту красный цвет,
bgcolor=»green» — назначаем фону зелёный цвет.

Таблица основных имён цветов HTML:

Имя цвета Его вид Перевод
white Белый
ivory Слоновая кость
silver Серебряный
gray Серый
black Чёрный
maroon Тёмно-бордовый
red Красный
orange Оранжевый
gold Золотой
yellow Жёлтый
olive Оливковый
lime Лайм
green Зелёный
aqua Морская волна
blue Синий
navy Нави
teal Бирюзовый
fuchsia Фуксиновый
purple Пурпурный

Шестнадцатеричная система счисления

В повседневной жизни мы пользуемся десятичной системой счисления от 0 до 9 . Программисты и дизайнеры часто используют шестнадцатеричную систему счисления от 0 до 15 , где:

10 = A
11 = B
12 = C
13 = D
14 = E
15 = F

Практически каждый цвет и оттенок видимый нашему зрению можно записать в шестнадцатеричной системе, например красный цвет red (красный) в шестнадцатеричной системе будет равен ff0000

color=»red» — красный цвет, по имени,
color=»#ff0000″ — красный цвет, в шестнадцатеричной системе счисления.

В языке HTML, перед шестнадцатеричным числом, в значении атрибута ставят знак решётки #

RGB

Перед тем как начать указывать цвета в HTML с помощью шестнадцатеричной системы счисления, вам для начала нужно узнать о таком понятии как R G B

RGB — это сокращение от слов R ed G reen B lue (Красный Зелёный Синий).

Цвет в HTML, записанный в шестнадцатеричной системе состоит из трех блоков чисел 00 00 00 , где каждый блок отвечает за один из цветов RGB, первый блок за красный цвет, второй за зелёный цвет, третий за синий цвет. Числа могут варьироваться от 00 до ff .

Где, ff — это 255 в десятичной системе счисления.

Схема RGB:
Red — от 00 до ff
Green — от 00 до ff
Blue — от 00 до ff

В итоге получаем число из шести цифр 000000 , где первые два числа отвечают за красный цвет, вторые два числа отвечают за зелёный цвет, третьи два числа отвечают за синий цвет.

Если мы хотим получить красный цвет, то пишем ff0000 , зелёный цвет 00ff00 , синий цвет 0000ff . Например, если хотим получить тёмно красный цвет, то нужно уменьшить первый блок чисел и вместо ff (который равен в десятичной системе счисления 255) , записать например 96 (который равен в десятичной системе счисления 150) .

Приведём для наглядности, примеры цветов и их шестнадцатеричный код:

Смешиваем цвета в HTML

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

Цвета, заданные с помощью шестнадцатеричной системы счисления и RGB, тоже можно смешивать:

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

Коды цветов в 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 цветовой палитрой.

Таблица «безопасных» цветов в 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

>>Управление цветом

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

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

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

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

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

Шестнадцатеричная система счисления, в отличии от десятичной в своём ряду цифр имеет не десять знаков, а шестнадцать — отсюда и название. Соответственно не повторяющихся вариантов сочетаний из двух цифр может быть только — 256 , для продолжения ряда цифр после 9 используются буквы от A до F , следовательно, ряд будет выглядеть так —

0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F.
Для перевода чисел из одной системы счисления в другую и наоборот воспользуйтесь калькулятором, приведенным ниже. Максимальное значение здесь может быть FF 255 .

В этом случае цвет задается тремя шестнадцатеричными числами, каждое из которых состоит из двух цифр. Первое число определяет интенсивность красного цвета, среднее- зеленого , последнее- синего цвета. Все числа могут принимать значения в диапазоне от 00 до FF (от 0 до 255). Например: зеленый цвет задается как #00FF00 , красный — как #FF0000 , синий — как #0000FF , белый — как #FFFFFF , полное отсутствие цвета или черный задается как #000000 .

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

Примеры некоторых шестнадцатеричных значений цветов RGB: градации красного, синего и зеленого цветов.

вид код вид код вид код вид код вид код вид код
#010000 #800000 #000100 #008000 #000001 #000080
#100000 #900000 #001000 #009000 #000010 #000090
#200000 #A00000 #002000 #00A000 #000020 #0000A0
#300000 #B00000 #003000 #00B000 #000030 #0000B0
#400000 #C00000 #004000 #00C000 #000040 #0000C0
#500000 #D00000 #005000 #00D000 #000050 #0000D0
#600000 #E00000 #006000 #00E000 #000060 #0000E0
#700000 #FF0000 #007000 #00FF00 #000070 #0000FF

Задание цвета при помощи строчных литералов

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

вид имя вид имя вид имя вид имя
White Red Orange Yellow
Green Blue Purple Black
Aliceblue Antiquewhite Aqua Aquamarine
Azure Beige Bisque Blanchedalmond
Blueviolet Brown Burlywood Cadetblue
Chartreuse Chocolate Coral Cornflowerblue
Cornsilk Crimson Cyan Darkblue
Darkcyan Darkgoldenrod Darkgray Darkgreen
Darkkhaki Darkmagenta Darkolivegreen Darkorange
Darkorchid Darkred Darksalmon Darkseagreen
Darkslateblue Darkslategray Darkturquoise Darkviolet
Deeppink Deepskyblue Dimgray Dodgerblue
Firebrick Floralwhite Forestgreen Fuschia
Gainsboro Ghostwhite Gold Goldenrod
Gray Greenyellow Honeydew Hotpink
Indianred Indigo Ivory Khaki
Lavender Lavenderblush Lemonchiffon Lightblue
Lightcoral Lightcyan Lightcoldenrodyellow Lightgreen
Lightgray Lightpink Lightsalmon Lightseagreen
Lightskyblue Lightslategray Lightsteelblue Lightyellow
Lime Limegreen Linen Magenta
Maroon Mediumaquamarine Mediumblue Mediumorchid
Mediumpurple Mediumseagreen Mediumslateblue Mediumspringgreen
Mediumturquoise Mediumvioletred Midnightblue Mintcream
Mistyrose Navajowhite Navy Oldlace
Olive Olivedrab Orangered Orchid
Palegoldenrod Palegreen Paleturquoise Palevioletred
Papayawhip Peachpuff Peru Pink
Plum Powderblue Rosybrown Royalblue
Saddlebrown Seagreen Seashell Sienna
Silver Skyblue Slateblue Slategray
Snow Springgreen Steelblue Tan
Teal Thistle Tomato Turquoise
Violet Wheat Whitesmoke Yellowgreen
Перечень строчных литералов с названиями цветов довольно обширен и более чем достаточен. Если необходимо задать в качестве фонового цвет настолько необычный, что ему даже нет названия, то можно воспользоваться шестнадцатеричным значением.

Использование безопасной палитры цветов

К сожалению, на разных платформах, с разными системными настройками, правильная передача цвета является проблемой. Все дело в том, что браузер всегда старается подстроить цветовую палитру документа под системные настройки и возможности монитора, путем самостоятельного смешивания цветов и их замещения. Как результат — иногда пользователь видит не совсем то, что хотел ему показать web-мастер. Выход из этой ситуации был найден в применении палитры, каждый цвет которой гарантированно передается одинаково всеми браузерами на разных платформах. Это так называемая гарантированная палитра, еще ее называют безопасной палитрой. В эту палитру входят цвета, цветовые составляющие которых, принимают следующие значения:00 ,33 ,66 ,99 , CC ,FF , во всех возможных 216 их сочетаниях.

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

Цвета html обозначаются шестью символами после символа слеш — например, #000000. Эти шесть символов обозначают доли различных цветов (Красного, Зеленого и Синего цветов (Red, Green, Blue)) в итоговом цвете. В мониторе вашего комьютера изображение формируется из огромного количества точек, называемых пикселями. Каждый пиксел — это маленький источник света, назовём его «фонарик», который в свою очередь состоит из трех фонариков — красного, зеленого и синего цвета. Уменьшая или увеличивая интенсивность свечения отдельных цветных фонариков, мы получаем нужный цвет.

Коды цветов html

Цвета в HTML обозначаются шестнадцатиричным (HEX) обозначением сочетания красного, синего и зеленого цвета (RGB).

Наименьшим значением цвета является 0 (шестнадцатиричное 00). Наибольшим значением цвета является 255 (шестнадцатиричное FF).

Шестнадцатиричное значение цвета представляет из себя три цифры, начинающиеся со знака #.

Коды (значения) цветов

Цвет Код HEX Код RGB
#000000 rgb(0,0,0)
#FF0000 rgb(255,0,0)
#00FF00 rgb(0,255,0)
#0000FF rgb(0,0,255)
#FFFF00 rgb(255,255,0)
#00FFFF rgb(0,255,255)
#FF00FF rgb(255,0,255)
#C0C0C0 rgb(192,192,192)
#FFFFFF rgb(255,255,255)

16 миллионов оттенков

Сочетание красного, синего и зеленого цветов со значениями с долей каждого цвета от 0 до 255 дают в сумме более 16 миллионов оттенков (256 x 256 x 256).

Большинство современных мониторов способны отобразить не меньше 16384 различных оттенков (ЖК-мониторы, в основном, способны отображать 262 тысячи 16 миллионов (обновлено в октябре 2013 г.) цветов, а ЭЛТ-мониторы способны отображать практически неограниченное количество цветов).

В цветовой таблице ниже приведено изменение доли красного цвета с 0 до 255 при нулевых значениях синего и зеленого цветов:

Красный Код HEX Код RGB
#000000 rgb(0,0,0)
#080000 rgb(8,0,0)
#100000 rgb(16,0,0)
#180000 rgb(24,0,0)
#200000 rgb(32,0,0)
#280000 rgb(40,0,0)
#300000 rgb(48,0,0)
#380000 rgb(56,0,0)
#400000 rgb(64,0,0)
#480000 rgb(72,0,0)
#500000 rgb(80,0,0)
#580000 rgb(88,0,0)
#600000 rgb(96,0,0)
#680000 rgb(104,0,0)
#700000 rgb(112,0,0)
#780000 rgb(120,0,0)
#800000 rgb(128,0,0)
#880000 rgb(136,0,0)
#900000 rgb(144,0,0)
#980000 rgb(152,0,0)
#A00000 rgb(160,0,0)
#A80000 rgb(168,0,0)
#B00000 rgb(176,0,0)
#B80000 rgb(184,0,0)
#C00000 rgb(192,0,0)
#C80000 rgb(200,0,0)
#D00000 rgb(208,0,0)
#D80000 rgb(216,0,0)
#E00000 rgb(224,0,0)
#E80000 rgb(232,0,0)
#F00000 rgb(240,0,0)
#F80000 rgb(248,0,0)
#FF0000 rgb(255,0,0)

Оттенки серого

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

Оттенки серого Код HEX Код RGB
#000000 rgb(0,0,0)
#080808 rgb(8,8,8)
#101010 rgb(16,16,16)
#181818 rgb(24,24,24)
#202020 rgb(32,32,32)
#282828 rgb(40,40,40)
#303030 rgb(48,48,48)
#383838 rgb(56,56,56)
#404040 rgb(64,64,64)
#484848 rgb(72,72,72)
#505050 rgb(80,80,80)
#585858 rgb(88,88,88)
#606060 rgb(96,96,96)
#686868 rgb(104,104,104)
#707070 rgb(112,112,112)
#787878 rgb(120,120,120)
#808080 rgb(128,128,128)
#888888 rgb(136,136,136)
#909090 rgb(144,144,144)
#989898 rgb(152,152,152)
#A0A0A0 rgb(160,160,160)
#A8A8A8 rgb(168,168,168)
#B0B0B0 rgb(176,176,176)
#B8B8B8 rgb(184,184,184)
#C0C0C0 rgb(192,192,192)
#C8C8C8 rgb(200,200,200)
#D0D0D0 rgb(208,208,208)
#D8D8D8 rgb(216,216,216)
#E0E0E0 rgb(224,224,224)
#E8E8E8 rgb(232,232,232)
#F0F0F0 rgb(240,240,240)
#F8F8F8 rgb(248,248,248)
#FFFFFF rgb(255,255,255)

Кросс-браузерные (для всех браузеров) названия цветов html

Коллекция из 150 названий цветов в html, поддерживаемых во всех браузерах.

Стандартизированные названия цветов

Консорциум W3C перечисляет 16 валидных названий цветов для HTML и CSS: aqua (аквамарин), black (черный), blue (синий), fuchsia (фуксиновый), gray (серый), green (зеленый), lime (лайм или салатовый), maroon (каштановый), navy (ультрамарин), olive (оливковый), purple (пурпурный), red (красный), silver (серебристый), teal (сизый), white (белый) и yellow (желтый).

При использовании цветов, не входящих в этот список, правильнее будет использовать их шестнадцатиричный код (HEX) или код RGB.

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

Несколько лет назад, когда компьютеры могли поддерживать максимум 256 различных цветов, был предложен список из 216 «Безопасных web-цветов» с 40 цветами, зарезервированными для системы.

Эта 216-цветная палитра была создана для того, чтобы правильно отобразить цвета в режиме 256-цветной палитры.

Теперь это не важно, потому что большинство компьютеров во всем мире поддерживают миллионы оттенков цвета. В любом случае вот список этих цветов:

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

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

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

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

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

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

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

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

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

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

Чтобы гарантированно получить на выходе в любом браузере и на любом мониторе тот цвет, который Вы прописали в коде, рекомендуется использовать «Безопасные цвета». Они были определены не вручную или по чьему-то желанию, а математически. Таких на 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 страницах.

Темно бордовый цвет код. Учeбник HTML

В 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

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

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

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

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

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

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

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

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

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

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

Чтобы гарантированно получить на выходе в любом браузере и на любом мониторе тот цвет, который Вы прописали в коде, рекомендуется использовать «Безопасные цвета». Они были определены не вручную или по чьему-то желанию, а математически. Таких на 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 страницах.

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

В 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 в шестнадцатеричной.

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

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

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

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

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

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

Рис. 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 цветов. Пример веб-цвета — #33FF66.

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

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

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

Табл. 6.3. Названия некоторых цветов
Имя цвета Цвет Описание Шестнадцатеричное значение
black Черный #000000
blue Синий #0000FF
fuchsia Светло-фиолетовый #FF00FF
gray Темно-серый #808080
green Зеленый #008000
lime Светло-зеленый #00FF00
maroon Темно-красный #800000
navy Темно-синий #000080
olive Оливковый #808000
purple Темно-фиолетовый #800080
red Красный #FF0000
silver Светло-серый #C0C0C0
teal Сине-зеленый #008080
white Белый #FFFFFF
yellow Желтый #FFFF00

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

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

Цвета

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

В данном примере цвет фона задается с помощью атрибута bgcolor тега

, а цвет текста через атрибут text . Для разнообразия значение у атрибута text установлено в виде шестнадцатеричного числа, а у bgcolor с помощью зарезервированного ключевого слова teal .
В 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 (розовато-лавандовый) &nbsp#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)

Для задания цветов используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из её названия, на числе 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. Цвета на веб-странице

Как работают hex-коды для обозначения цветов

Перевод статьи «How Hex Code Colors Work – and How to Choose Colors Without A Color Picker».

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

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

По мере накопления опыта вы начнете смотреть скорее на сами коды цветов, а не просто полагаться на редактор. Вы заметите, что выбираемые вами цвета обозначаются какими-то странными кодами, вроде #ff0000.

Это hex-коды цветов. Они — фундаментальная часть работы HTML и CSS. Если вы разберетесь в том, как они функционируют, это не только поможет вам сэкономить массу времени, но и позволит создавать более элегантный и надежный код, причем гораздо быстрее.

В этой статье я расскажу вам обо всем, что вам нужно знать о hex-кодировке цветов.

Что означает слово «hex»?

Для начала давайте разберем, что в термине «hex-код» означает слово «hex». В этом контексте «hex» — это сокращение слова «hexadecimal» (англ. «шестнадцатеричный»).4. В общем, конвертировать числа шестнадцатеричной системы в двоичные (и обратно) просто удобно. Но сейчас мы этим заниматься не будем.

Это была просто дополнительная информация. Она вам не нужна для применения hex-кодов цветов, но может пригодиться, если захотите произвести впечатление на кого-нибудь.

Из каких компонентов состоит цвет?

Как шестнадцатеричные коды используются для обозначения RGB-цветов? (RGB — цветовая модель, описывающая способ кодирования цвета для цветовоспроизведения с помощью трёх цветов, которые принято называть основными. Сама аббревиатура RGB расшифровывается как red, green, blue — красный, зелёный, синий. — Прим. ред. Techrocks).

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

К этому моменту внимательные читатели могли уже понять, насколько просто работать с цветами, представленными в такой форме. Черный цвет представляется как RGB (0,0,0), а белый — RGB (255,255,255). Ну а зеленый, соответственно, — RGB (0,255,0).

Hex-кодировка цветов

Теперь, зная, что в принципе означают коды цветов, давайте посмотрим на hex-коды. Возьмем, к примеру, #ff0000, и попробуем разобраться, что этот код означает.

Посмотрите на таблицу перевода чисел из шестнадцатеричной системы в десятичную, и вы увидите, что «FF» — это 255 в десятичной системе.

Это подсказка. Два первых символа в нашем hex-коде (да и во всех остальных тоже) относятся к красному цвету, и в данном случае его значение — 255. Следующие два символа отвечают за зеленый, а последние — за синий цвет.

Исходя из этого, вы можете понять, что #ff0000 — то же самое, что RGB (255,0,0). То есть, чистый красный. Аналогично, #ff00ff — это максимум красного и одновременно синего, а вместе они дают пурпурный (magenta).

На этом этапе вы, вероятно, уже осознали значение и элегантность hex-кодов. Поскольку они шестнадцатеричные, а максимальное значение каждого компонента — 255, при помощи всего 6 символов можно передать практически любой цвет.

Эта система также означает, что вам доступна очень широкая палитра цветов, потому что каждый компонент может иметь любое значение, от 0 до 255. Попробуйте прикинуть количество вариантов, и вы поймете, что вам доступны 16777216 цветов.

Как использовать сокращенные обозначения цвета

Разобравшись с hex-кодами, вы можете начать использовать их в своих веб-проектах — вместо пипетки в программе для выбора цвета.

Но сначала будет полезным узнать, что это не единственные опции.

Поскольку HTML проектировался так, чтобы им было удобно пользоваться, он допускает использование сокращенной записи hex-кодов. Например, код чистого красного цвета #FF0000 можно сократить до #F00. Одна цифра для красного, одна для зеленого и одна для синего. Браузеры интерпретируют #FF0000 и #F00 одинаково.

Такая запись сокращает доступное количество цветов до примерно 4 тысяч, но ее применение дает некоторые преимущества.

Сокращенный формат записи цветов может улучшить производительность ваших веб-страниц. Это может быть незаметно в маленьких проектах, но будет иметь большое значение, когда ваши проекты станут более сложными.

Почему стоит использовать hex-коды

Большинство конструкторов сайтов позволяют вводить hex-код вместо выбора цвета при помощи мыши. Такой подход имеет ряд преимуществ.

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

Во-вторых, использование hex-кодов позволяет подбирать цвета куда более точно. Никакой графический инструмент не содержит 16 миллионов доступных цветов. Если вы пользуетесь кодами, вам доступны любые оттенки.

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

Дополнительные преимущества

Hex-коды применяются при работе с HTML, но не только. Практически все программы для работы с изображениями пользуются той же кодировкой. Таким образом, разобравшись, как работают hex-коды, вы получаете полезный и переносимый навык.

Узнать код цвета (RGB, HEX)

Важную роль в том, насколько хорошо выглядит на экране монитора какой-либо графический объект и насколько он пригоден к использованию, играет цвет. Только представьте себе приложение или веб-сайт, которые вы используете или посещаете каждый день, если они будут выглядеть монохромными. Цвет помогает выделить различные элементы управления в пользовательском интерфейсе и его правильный выбор очень важен для веб-разработчиков. Как узнать код цвета, работая в операционной системе Windows 10 начинающему пользователю, не прибегая к использованию Photoshop или Illustrator, вы узнаете из этой статьи.

Если вы захотите узнать цветовой код графического элемента, не устанавливая в ОС дополнительное программное обеспечение, настоятельно рекомендуем использовать уже предустановленный в систему по умолчанию графический редактор Paint. Сделайте скриншот выбранного объекта на Рабочем столе, применив клавишу PrintScreen для снимка всего экрана, или добавьте в сочетание клавишу Alt для снимка активного окна. Это первый шаг.

Узнать код цвета

Запустите Paint и вставьте в рабочую область созданный скриншот. В разделе «Инструменты» выберите «Палитру» (значок с изображением пипетки). Нажмите на выбранный цвет, для которого хотите узнать код. Перейдите в окно «Изменение цветов», где и узнаете нужный RGB-код (красный, зеленый, синий).

Если вам нужен HEX-код (в виде #000000), а не RGB, то преобразуйте его в нужный формат, воспользовавшись инструментом «Дополнительный цвет» в разделе «Персонализация» системной утилиты «Параметры». Запустите её сочетанием клавиш Win+I на своей клавиатуре.

После нажатия на кнопку «Дополнительный цвет», вам откроется окно с цветовой палитрой. Внизу будет расположена кнопка «Больше», кликните по ней, чтобы расширить возможность выбора. Здесь сможете ввести RGB-код либо HSV, чтобы получить HEX-код и его предварительный просмотр. Это поистине замечательный и полезный системный инструмент.

Преобразование цвета в Google

Достаточно просто ввести код HEX в поисковую строку Google в своем веб-браузере. В результате поисковик представит вам его результат дополнительно в таких цветовых кодах:

Такие инструменты вряд ли станут частью вашего ежедневного арсенала приложений. Тем более не совсем подходят профессионалам в области дизайна. У них, вероятнее всего, уже есть свои наиболее предпочтительные. Предложенные нами способы узнать код цвета в большей степени ориентированы на людей, которым редко приходится редактировать графические объекты. Это работает быстро и исключает необходимость установки в систему дорогостоящего ПО. Спасибо за внимание!

Главная / Графика / Простой способ узнать код цвета (RGB, HEX) в Windows 10

Как работать с цветами в digital-маркетинге — БЛОГ ADVENTUM

Подбирать цвета убийственно сложно: все эти RGB, CMY, RYB, HSV больше мешают, чем помогают. Разобрались, как удачно подобрать цвета для проекта и сэкономить на дизайнере.

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

Цвет подробно изучали двое ученых — Ньютон и Гете. Все современные модели работы с цветом основываются на их открытиях.

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

 

На этом принципе построена работа всех современных устройств. Модель, по которой свет распадается и собирается обратно, — RGB

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

Спустя 150 Гете в «Теории цвета» анализирует цвет с точки зрения восприятия человека. Гете создает цветовой круг, который впоследствии улучшает художник Иоханнес Иттен:

Цветовой круг. Основные цвета — Красный, Желтый и Синий (Модель RYB).

Цветовые модели и сочетания цветов

Существует 5 популярных цветовых моделей: RYB, RGB, CMY (иногда указывается как CMYK), HSL (она же HSV) и LAB. LAB и HSV мы не будем рассматривать, потому что они не помогут научиться подбирать цвета. Остановимся на анализе RYB, RGB и CMY.

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

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

RYB — классическая цветоваяцветова, начало которой положил Гете, а улучшил Иттен. Эта модель популярна у художников, потому что объясняет правила смешивания пигментов цветов. Хотя RYB не используется в электронике и печати, она содержит ряд важных наблюдений: на ее основе разработаны RGB и CMY, и по ее примеру комбинируются цвета внутри этих моделей.

Иттен полагал, что можно найти цветовую гармонию через цветовое колесо:

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

Разберём несколько характеристик цвета: они помогут вамвам пон, как применять и комбинировать цвета в работе.

Тон — это чистый цвет: зеленый, синий, красный и так далее.

Оттенок — это добавление к чистому цвету белого цвета:

Тень — это добавление к чистому цвету черного цвета:


Первичные цвета — это основные цвета, из которых получаются остальные цвета. Вторичные цвета — это цвета, которые получаются при смешивании основных цветов. Из смеси вторичных цветов с первичными получаются третичные цвета.

Аналоговые и дополнительные цвета, Триада, Тетрада и Квадрат — это основные способы получения цветных схем.

В каждой модели дополнительный цвет является смесью двух основных, поэтому при сложении дополнительного цвета с оставшимся основным, вы получите цвет в середине модели: Черный для RYB и CMY, белый для RGB.

В RYB первичные цвета: Красный, Желтый и Синий.
В RGB: Красный, Зеленый и Синий.
В CMY: Циан, Пурпурный и Желтый.

У RGB в середине получается белый свет, потому что модель RGB используется в источниках света, например, мониторах. У CMY и RYB в середине будет получаться черный, потому что смесь красок дает черный цвет.

Основные цвета RGB — это вторичные цвета CMY. Основные цвета CMY — это вторичные цвета RGB. Эти модели разные, но тесно связаны. RYB с ними связан меньше.

CMYK — это тот же CMY, но с добавлением «ключевого цвета» — черного. Дело в том, что смесь CMY не дает настоящего черного цвета, поэтому эффективнее и экономичнее использовать черную краску.

 

Как подобрать цвет для проекта

Человеческий глаз видит 10 миллионов цветов. Из этих 10 миллионов вам нужно выбрать 1 цвет, который будет коррелировать с сайтом и брендом.

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

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

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

К счастью, подобрать цвет сегодня не так сложно:

  • Возьмите за основу существующий дизайн. Если у вас есть логотип и цветовая тема, начните с нее, не переделывайте все с нуля.
  • Не используйте цвета конкурентов. Это поможет вам отстраниться от них и не давать бесплатной рекламы.
  • Помните про аудиторию. Сайт детского сада не должен напоминать похоронное бюро. Продумайте тон послания, которое вы хотите донести аудитории (радость, серьезность намерений и т.п).
  • Не используйте клише. Помнить про запросы аудитории — хорошо, но необязательно раскрашивать сайт для девочек в розовый цвет. Отход от клише повысит доверие к вам.
  • Выпишите слова. Если сложно подобрать цвет, выпишите слова, которые у вас ассоциируются с вашим брендом. Ассоциации помогут натолкнуть вас на правильный выбор цвета. Если все равно не получается, попробуйте загуглить значения цветов.

Можно черпать идеи у сайтов, которые вам нравятся:

Загрузите скриншот понравившегося сайта и узнайте его цветовую палитру. Подборка цветов от Адобе: https://color.adobe.com/ru/create/color-wheel/

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

Выберите гармоничный основной цвет.

Черпать вдохновение можно на Дриббле и Дизайниспирейшене можно посмотреть работы дизайнеров и заимствовать их цветовые палитры.

 

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

 

Создание цветовой палитры.

Тон / Hue — это то, что мы имеем в виду, говоря «цвет». Синий, красный, зеленый, оранжевый, фиолетовый и тд.
Насыщенность / Saturation — параметр цвета, характеризующий степень чистоты цветового тона.
Яркость / Brightness — обозначает степень отличия цвета от белого или черного.

Теперь у вас должен быть HEX-код цвета. HEX-код состоит из трех пар цифр и может принимать значения от 0 до 9 и букв от A до F.

Первая цифра уточняет цвет, вторая — оттенок. Чем больше значение пар, тем светлее цвет:

В уже знакомым нам RGB и CMY значения цветов будут такими:

Если понимать шестнадцатеричный код цветов, вы сможете точно комбинировать цвета и цветовые схемы.

Есть несколько простых техник работы с кодом:

  • Переставлять одну пару в разные места кода
  • Удвоение первой цифры в первой паре и разделение на два остальные первые цифры
  • Комбинирование цветов из фото

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

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

Реально вам нужно только 2 цвета:

  • основной цвет (в нашем случае это #30c9e8),
  • акцентный цвет.

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

Как подобрать акцентирующий цвет

Зайдите в Палеттон и вбейте код цвета. Вы сможете быстро подобрать к нему удачный акцентирующий цвет

Если результат не устраивает, то все-таки можно поиграться с триадами и тетрадами

В итоге мы получаем гармоничную цветовую схему. Добавим также белый цвет, потому что белый — всегда круто.

Осталось добавить серого

 

Подбираем гармоничный серый.

Подобрать серый можно в том же Дриббле и Дизайниспирейшене. Либо, если у вас есть Фотошоп, можно сделать так:

 

Нужно отметить, что этот метод работает очень хорошо с синим цветом. Если у вас другой цвет, вам нужно либо повысить прозрачность в пределах 5—10%, или ограничиться стандартным серым.

Посмотрите, какой кайф:

 

Как по-другому подобрать цвета.

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

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

Красный — акцентный цвет, который отлично выделяется  на голубом. Он используется на малых участках и как будто скуповато. Это правильно: чем меньше вы используете красного, тем сильнее он выделяется.

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

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

Убедитесь, что у вас достаточно контраста между фоном и текстом: так его проще читать и быстрее усваивать.

Гайдлайн по контрастам (на английском)
Проверка на контраст

 

Удачные и неудачные цветовые решения

Несколько удачных и неудачных подборок цвета.

 

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

 

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

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

Бонус

Классный ролик про тени (есть русские субтитры)

Попробуйте угадать, какого цвета эти квадраты (а потом проверьте значение HEX-кода в Фотошопе):

Источники:
Иоханнес Иттен, «Искусство цвета»
A Simple Web Developer’s Color Guide

 

Цвета в палитре rgb формируются путем. Цветовая модель RGB

Чтобы пользоваться предварительным просмотром презентаций создайте себе аккаунт (учетную запись) Google и войдите в него: https://accounts.google.com


Подписи к слайдам:

Белый свет имеет сложную структуру.

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

Белый свет имеет сложную структуру!

Состав белого света: Фиолетовый Синий Голубой Зеленый Желтый Оранжевый Красный Для запоминания цветов в спектре пользуются условной фразой: « К аждый О хотник Ж елает З нать, где С идит Ф азан».

Глаз человека Человек воспринимает свет с помощью цветовых рецепторов (так называемых колбочек), находящихся на сетчатке глаза.

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

Тема урока: Палитры цветов в системах цветопередачи RGB, CMYK и HSB.

Системы цветопередачи: RGB (R ed, G reen, B lue) CMYK (C yan, M agenta, Y ellow, blac K) HSB (H ue, S aturation, B rightness) красный зеленый синий черный жёлтый пурпурный голубой оттенок насыщенность яркость

RGB Основными цветами являются красный, зеленый, синий. Палитра цветов формируется путем сложения красного, зеленого и синего цветов. Цвет палитры можно определить с помощью формулы:

Цвет Коды интенсивности базовых цветов Красный Зеленый Синий Черный 00000000 0 00000000 0 00000000 0 Красный 11111111 255 00000000 0 00000000 0 Зеленый 00000000 0 11111111 255 00000000 0 Синий 00000000 0 00000000 0 11111111 255 00000000 0 11111111 255 11111111 255 Пурпурный 11111111 255 00000000 0 11111111 255 Желтый 11111111 255 11111111 255 00000000 0 11111111 255 11111111 255 11111111 255 Кодировка цветов при глубине цвета 24 бита

RGB Применяется в мониторах компьютеров, в телевизорах и других излучающих технических устройствах.

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

Цвет Формирование цвета Black = С + М + Y = W – G – B – R White = (C = 0, M = 0, Y =0) Red = Y + M = W – G – B Green = Y + C = W – R – B Blue = M + C = W – R – G Cyan = W – R = G + B Magenta = W – G = R + B Yellow = W – B = R +G Формирование цветов в системе цветопередачи CMYK

CMYK Основана на восприятии не излучаемого, а отражаемого света. Применяется в полиграфии, при печати изображений на принтерах (т.к. напечатанные документы воспринимаются человеком в отраженном свете).

Самое главное: Существуют следующие системы цветопередачи: RGB (R ed, G reen, B lue) CMYK (C yan, M agenta, Y ellow, blac K) HSB (H ue, S aturation, B rightness) Палитра цветов в системе цветопередачи RGB формируется путем сложения красного, зеленого и синего цветов. Цвет палитры можно определить с помощью формулы:

Самое главное: Основными цветами в системе цветопередачи CMYK являются голубой, пурпурный, желтый. Палитра цветов формируется: путем вычитания из белого цвета определенных цветов путем наложения голубого, пурпурного, желтого цвета. Цвет палитры можно определить с помощью формулы

Самое главное: Система цветопередачи HSB использует в качестве базовых параметров Hue (оттенок цвета), Saturation (насыщенность), Brightness (яркость). Параметр Hue позволяет выбрать оттенок цвета из всех цветов оптического спектра, начиная с красного цвета и заканчивая фиолетовым Параметр Saturation определяет процент «чистого» оттенка и белого цвета. Параметр Brightness определяет интенсивность цвета

Выполнить задания: Задание 1.7 (стр.21) Определить цвета, если заданы интенсивности базовых цветов в системе цветопередачи RGB Задание 1.8 (стр.21) Определить цвета, если на бумагу нанесены краски в системе цветопередачи CMYK .

Задание 1.7 Цвет Интенсивность базовых цветов Красный Зеленый Синий 00000000 00000000 00000000 11111111 00000000 00000000 00000000 11111111 00000000 00000000 00000000 11111111 00000000 11111111 11111111 11111111 00000000 11111111 11111111 11111111 00000000 11111111 11111111 11111111

Задание 1.8 (стр.21) Цвет Формирование цвета (C = 0, M = 0, Y =0) Y + M = W – G – B Y + C = W – R – B M + C = W – R – G W – R = G + B W – G = R + B W – B = R +G

Создание изображения в неправильном цветовом режиме может стать проблемой. Рассмотрим основные различия между двумя цветовыми моделями RGB и CMYK .

RGB:

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

Аддитивная модель

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

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

Если вы хотите, чтобы макет был напечатан профессионально, придется изменить цветовой режим на CMYK .

CMYK:

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

Субтрактивная цветовая модель

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

Основной цвет для цветовой модели CMYK – черный (K ). Добавление этого цвета помогает нейтрализовать изображения и увеличить плотность тени.

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

Такие программы, как Photoshop , Illustrator и InDesign , предоставляют пресеты CMYK , которые помогают подобрать лучшую комбинацию настроек печати.

Почему эти два режима отображаются по-разному?

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

Например, RGB предлагает более широкий диапазон цветов. Поэтому созданный в этой модели файл позволяет использовать яркие, живые цвета. Когда он преобразуется в CMYK , многие из ярких оттенков выглядят тусклыми или мутными.

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

Какой режим нужно использовать?

Многие дизайнеры по-прежнему предпочитают создавать свои проекты сначала в RGB , а затем конвертировать их в CMYK перед отправкой на ​​печать. Это связано с тем, что RGB поддерживает более широкий диапазон цветов.

Еще одним преимуществом является то, что RGB позволяет работать с файлами меньшего размера. А также, что Photoshop , InDesign и Illustrator базируются на RGB и эта модель поддерживается в web .

Но если в отпечатанной продукции важна точность цвета, то лучше использовать CMYK . Проектирование в этом цветовом режиме позволит получить более четкое представление о готовом продукте.

Если используете цифровой принтер, сохраните файл в формате RGB . Это лучший вариант при печати фотографий. Ели у вас есть файл, который нужно распечатать на офсетном полноцветном принтере, то проведите преобразование в CMYK .

Инструменты для конвертирования

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

Adobe Photoshop , Illustrator и InDesign являются наиболее распространенными программами, используемыми для создания графических проектов. Они ориентированы на работу в режиме RGB .

Поэтому данные редакторы упрощают преобразование в CMYK и установку конкретной схемы цветопередачи для печати. Это выполняется следующим образом:

Illustrator: Файл > Цветовой режим документа > CMYK или RGB .

InDesign: Окно> Цвет > CMYK или RGB .

Пошаговая инструкция по настройке цветовых режимов для печати в Photoshop :

Шаг 1 . Выберите меню «Редактирование » (Edit ), затем пункт «Настройка цветов » (Color Setting ).

Шаг 2 . Выберите профиль CMYK , наиболее подходящий для печати.

Шаг 3 . Вы можете выбрать опцию «Больше параметров », чтобы установить схему цветопередачи при преобразовании значений RGB в CMYK . «Перцепционный » метод лучше всего подходит для фотографий, поскольку сохраняет визуальное соответствие с исходным изображением.

Шаг 4 . Откройте изображение RGB , которое нужно преобразовать.

Шаг 5 . Внесите изменения, пока изображение еще находится в режиме RGB .

Конспект урока

Учитель: Иванова Светлана Юрьевна

Предмет: информатика и ИКТ

Класс: 9

Тема: Формирование цвета в системах цветопередачи RGB , CMYK и HSB (Палитры цветов в системах цветопередачи RGB , CMYK и HSB )

Тип урока: изучение нового материала

Цели:

предметные: дать представление о палитрах цветов в системах цветопередачи;

метапредметные:

а) регулятивные: приобретение опыта работы с графическими изображениями; прием и сохранение учебной задачи; осуществление самоконтроля;

б) познавательные: анализ ориентира действия в новом учебном материале с сотрудничестве с учителем; осуществление итогового контроля по результату; преобразование практической задачи в познавательную; построение логических рассуждений;

в) коммуникативные: адекватное восприятие оценки учителя, товарищей; постановка вопросов, необходимых для организации собственной деятельности и сотрудничества с партнером;

г) межпредметные: связь и обобщение предметных знаний физики и информатики для видения объекта в единстве его многообразных свойств;

личностные: формирование устойчивого учебно-познавательного интереса к новым общим способам решения задач.

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

Используемые технологии: проблемно-диалоговая, дифференцированный подход, ИКТ-технология.

Инвентарь и оборудование: проектор, экран, ноутбук учительский и ноутбуки ученические с установленными графическим редактором PhotoShop и тестовой оболочкой MyTest , раздаточный материал, карточки с домашним заданием.

Ход урока:

    Организационный момент.

Приветствие: Здравствуйте, ребята! Я рада вас видеть! По словам философа Е. Ильенкова «Вся человеческая жизнь – это не что иное. Как постоянное желание достичь успеха в решении новых вопросов и проблем». И сегодня девиз нашего урока «Настоящее сокровище для человека – умение трудится». (Езоп). За работу!

    Актуализация знаний.

Перед изучением новой темы, предлагаю выполнить тест на повторение (раздаю карточки с тестом). На прошлом уроке мы познакомились с растровыми изображениями. Давайте вспомним, как называется минимальный участок изображения, для которого независимым образом можно задать цвет? (пиксель). Что такое «глубина цвета»? (Количество информации, которое используется для кодирования цвета точки изображения). Мы знаем, что на экране монитора цвет точки имеет двоичный код. Что это значит? (состоит из 0 и 1). А как связаны между собой «глубина цвета» и «палитра цветов»?(N =2 i – формула Хартли) (1 слайд )

    Постановка учебной задачи.

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

И сегодня на уроке мы выясним

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

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

Сформулируем тему урока.(2 слайд).

    Изучение нового материала.

Вспомним опыт Ньютона (просмотр видео ).

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

Хорошо известна фраза, которая помогает легко запомнить последовательность цветов в спектре видимого света: «Каждый охотник желает знать, где сидит фазан».

Человек воспринимает свет с помощью цветовых рецепторов, так называемых колбочек, находящихся на сетчатке глаза. (4 слайд) .

С экрана монитора мы воспринимаем цвет как сумму излучения трех базовых цветов: красного , зеленого и синего . Такая система цветопередачи называется RGB, по первым буквам английских названий цветов (Red — красный, Green — зеленый, Blue — синий ). (Давайте оставим две строчки для темы, мы ее с вами позже сформулируем, и запишем название первой цветовой модели) (5 слайд) .

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

Color = R + G + В, где 0 .

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

Наложение зеленого и синего цветов образует голубой цвет (Cyan), наложение красного и зеленого цветов — желтый цвет (Yellow), наложение красного и синего цветов — пурпурный цвет (Magenta). Таблица (6 слайд).

При глубине цвета в 24 бита на кодирование каждого из базовых цветов выделяется по 8 битов. В этом случае для каждого из цветов возможны N = 2 8 = 256 уровней интенсивности. Уровни интенсивности задаются десятичными (от минимального — 0 до максимального — 255) или двоичными (от 00000000 до 11111111) кодами. (7 слайд) .

При печати изображений на принтерах используется палитра цветов в системе CMY. Основными красками в ней являются Cyan — голубая , Magenta — пурпурная и Yellow — желтая. (8 слайд) .

Цвета в палитре CMY формируются путем наложения красок. Цвет палитры Color можно определить с помощью формулы, в которой интенсивность каждой краски задается в процентах:

Color = С+М + Y, где 0% Y

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

(Таблица). Рассмотрим, как формируется палитра цветов в системе CMYK. (записать) (10 слайд) .

Смешение трех красок — голубой , желтой и пурпурной — должно приводить к полному поглощению света, и мы должны увидеть черный цвет. Однако на практике вместо черного цвета получается грязно-бурый цвет. Поэтому в цветовую модель добавляют еще один, истинно черный цвет. Так как буква В уже используется для обозначения синего цвета, для обозначения черного цвета принята последняя буква в английском названии черного цвета Black , т. е. К . Расширенная палитра получила название CMYK . (11 слайд) .

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

А какая система цветопередачи применяется в полиграфии? (CMYK). И напечатанные изображения мы видим в отраженном свете.

    Практическая работа.

Вернемся к нашей испорченной фотографии. Как вы думаете, что нужно сделать перед тем как напечатать изображение? (Перевести его из RGB в CMYK ). И мы сейчас с вами на практике потренируемся конвертировать изображение из RGB в CMYK .

Разбейтесь, пожалуйста, на пары. Каждая пара берет ноутбук и занимает место за столом. Кто-нибудь из вас работал в графическом редакторе PhotoShop ? Давайте запустим программу. Перед нами рабочее поле. Слева – панель инструментов. Сверху – выпадающее меня, панель свойств. Справа – окна дополнительных панелей. Если мы откроем файл, то появится окно изображения. Конвертируем изображение из RGB в CMYK. Собственно, перевод из RGB в CMYK занимает ровно 1 секунду.

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

    RGB — цветовая модель для большей части мониторов, современных телевизоров, да и экранов вообще.

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

Что же происходит при конвертировании из RGB в CMYK ? Прежде всего, каждому пикселю графики присваиваются другие цифровые значения. В RGB это были условные R255G255B0 , а после конвертации пиксель приобрел значения С4M0Y93K0 .

    Как раз в этот момент картинка и может потерять в яркости. Причины, по которым это происходит, заключаются в том, что цветовой обхват модели RGB значительно больше, чем цветовой охват CMYK .

Фотошоп срочно подыскивает более тусклые цвета.

Результат данного перевода вовсе не максимум яркости, которую через CMYK можно обеспечить. И вы легко в этом убедитесь, просто применив цветокоррекцию Яркость/Контраст.

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

После конвертации из RGB в CMYK изображение надо обязательно цветокорректировать.

    Самостоятельная работа.

А сейчас предлагаю поработать самостоятельно с использованием тестовой оболочки MyTest . Перед вами три задания. Два первых — это легкие задания. Третье — посложнее. Выбираете любые два.

(Тестовая оболочка позволяет отправить ответы учеников учителю, который сразу видит результат. Ребята могут просмотреть вопросы, на которые ответилт неверно ).

    Домашнее задание.

Дома предлагаю подготовить небольшое сообщение о третьей цветовой модели HSB . Тем, кто справился со всеми заданиями, нужно выполнить одну из предложенных практических работ и написать небольшой вывод о проделанной работе. У кого возникли затруднения. Предлагаю заполнить таблицу и еще раз потренироваться в определении цвета.

    Рефлексия.

    Ребята, скажите, какие цвета являются базовыми для человеческого восприятия? (красный, зеленый, синий)

    Какие цветовые модели существуют?

    В каких видах деятельности целесообразно их использовать?

В самом низу ваших карточек оцените свою работу на уроке.

Спасибо за урок! Мне было приятно с вами работать!

Я собираюсь совершить экскурс в историю науки о человеческом восприятии, которая привела к созданию современных видеостандартов. Также я попытаюсь объяснить часто используемую терминологию. Кроме того, я вкратце расскажу, почему типичный процесс создания игры со временем будет всё больше и больше напоминать процесс, используемый в киноиндустрии.

Пионеры исследований цветовосприятия

Сегодня мы знаем, что сетчатка человеческого глаза содержит три разных типа фоторецепторных клеток, называемых колбочками. Каждый из трёх типов колбочек содержит белок из семейства белков опсинов, который поглощает свет в различных частях спектра:

Поглощение света опсинами

Колбочки соответствуют красной, зелёной и синей частям спектра и часто называются длинными (L), средними (M) и короткими (S) согласно длинам волн, к которым они наиболее чувствительны.

Одной из первых научных работ о взаимодействии света и сетчатки был трактат «Hypothesis Concerning Light and Colors» Исаака Ньютона, написанный между 1670-1675 гг. У Ньютона была теория, что свет с различными длинами волн приводил к резонансу сетчатки с теми же частотами; эти колебания затем передавались через оптический нерв в «сенсориум».


«Лучи света, падая на дно глаза, возбуждают колебания в сетчатке, которые распространяются по волокнам оптических нервов в мозг, создавая чувство зрения. Разные типы лучей создают колебания разной силы, которые согласно своей силе возбуждают ощущения разных цветов…»

Больше чем через сотню лет Томас Юнг пришёл к выводу, что так как частота резонанса — это свойство, зависящее от системы, то чтобы поглотить свет всех частот, в сетчатке должно быть бесконечное количество разных резонансных систем. Юнг посчитал это маловероятным, и рассудил, что количество ограничено одной системой для красного, жёлтого и синего. Эти цвета традиционно использовались в субтрактивном смешивании красок. По его собственным словам :

Поскольку по причинам, указанным Ньютоном, возможно, что движение сетчатки имеет скорее колебательную, чем волновую природу, частота колебаний должна зависеть от строения её вещества. Так как почти невозможно полагать, что каждая чувствительная точка сетчатки содержит бесконечное количество частиц, каждая из которых способна колебаться в идеальном согласии с любой возможной волной, становится необходимым предположить, что количество ограничено, например, тремя основными цветами: красным, жёлтым и синим…
Предположение Юнга относительно сетчатки было неверным, но он сделал правильный вывод: в глазе существует конечное количество типов клеток.

В 1850 году Герман Гельмгольц первым получил экспериментальное доказательство теории Юнга. Гельмгольц попросил испытуемого сопоставить цвета различных образцов источников света, регулируя яркость нескольких монохромных источников света. Он пришёл к выводу, что для сопоставления всех образцов необходимо и достаточно трёх источников света: в красной, зелёной и синей части спектра.

Рождение современной колориметрии

Перенесёмся в начало 1930-х. К тому времени научное сообщество имело достаточно хорошее представление о внутренней работе глаза. (Хотя потребовалось ещё 20 лет, чтобы Джорджу Уолду удалось экспериментально подтвердить присутствие и функции родопсинов в колбочках сетчатки. Это открытие привело его к Нобелевской премии по медицине в 1967 году.) Commission Internationale de L»Eclairage (Меж­ду­на­род­ная комиссия по освещению), CIE, поставила задачу по созданию исчерпывающей количественной оценки восприятия цвета человеком. Количественная оценка была основана на экспериментальных данных, собранных Уильямом Дэвидом Райтом и Джоном Гилдом при параметрах, схожих с выбранными впервые Германом Гельмгольцем. Базовыми настройками были выбраны 435,8 нм для синего цвета, 546,1 нм для зелёного и 700 нм для красного.


Экспериментальная установка Джона Гилда, три ручки регулируют основные цвета

Из-за значительного наложения чувствительности колбочек M и L невозможно было сопоставить некоторые длины волн с сине-зелёной частью спектра. Для «сопоставления» этих цветов в качестве точки отсчёта нужно было добавить немного основного красного цвета:

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

Результатом экспериментов стала таблица RGB-триад для каждой длины волны, что отображалось на графике следующим образом:


Функции сопоставления цветов RGB по CIE 1931

Разумеется, цвета с отрицательным красным компонентом невозможно отобразить с помощью основных цветов CIE.

Теперь мы можем найти трихромные коэффициенты для света распределения спектральной интенсивности S как следующее внутреннее произведение:

Может казаться очевидным, что чувствительность к различным длинам волн можно проинтегрировать таким образом, но на самом деле она зависит от физической чувствительности глаза, линейной по отношению к чувствительности к длинам волн. Это было эмпирически подтверждено в 1853 году Германом Грассманом, и представленные выше интегралы в современной формулировке известны нам как закон Грассмана.

Термин «цветовое пространство» возник потому, что основные цвета (красный, зелёный и синий) можно считать базисом векторного пространства. В этом пространстве различные цвета, воспринимаемые человеком, представлены лучами, исходящими из источника. Современное определение векторного пространства введено в 1888 году Джузеппе Пеано, но более чем за 30 лет до этого Джеймс Клерк Максвелл уже использовал только зародившиеся теории того, что позже стало линейной алгеброй, для формального описания трихроматической цветовой системы.

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

Этот новый набор основных цветов невозможно реализовать в физическом мире. Это просто математический инструмент, упрощающий работу с цветовым пространством. Кроме того, чтобы коэффициенты основных цветов всегда были положительными, новое пространство скомпоновано таким образом, что коэффициент цвета Y соответствует воспринимаемой яркости. Этот компонент известен как яркость CIE (подробнее о ней можно почитать в замечательной статье Color FAQ Чарльза Пойнтона (Charles Poynton)).

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

Координаты x и y известны как координаты цветности, и вместе с яркостью Y CIE они составляют цветовое пространство xyY CIE. Если мы расположим на графике координаты цветности всех цветов с заданной яркостью, у нас получится следующая диаграмма, которая вам наверно знакома:


Диаграмма xyY CIE 1931

И последнее, что нужно узнать — что считается белым цветом цветового пространства. В такой системе отображения белый цвет — это координаты x и y цвета, которые получаются, когда все коэффициенты основных цветов RGB равны между собой.

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

Передаточные функции

Прежде чем рассматривать видеостандарты, необходимо ввести и объяснить ещё две концепции.
Оптико-электронная передаточная функция
Оптико-электронная передаточная функция (optical-electronic transfer function, OETF) определяет то, как линейный свет, фиксируемый устройством (камерой) должен кодироваться в сигнале, т.е. это функция формы:

Раньше V был аналоговым сигналом, но сейчас, разумеется, он имеет цифровое кодирование. Обычно разработчики игр редко сталкиваются с OETF. Один из примеров, в котором функция будет важна: необходимость сочетания в игре видеозаписи с компьютерной графикой. В этом случае необходимо знать, с какой OETF было записано видео, чтобы восстановить линейный свет и правильно смешать его с компьютерным изображением.

Электронно-оптическая передаточная функция
Электронно-оптическая передаточная функция (electronic-optical transfer, EOTF) выполняет противоположную OETF задачу, т.е. она определяет, как сигнал будет преобразован в линейный свет:

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

Отношение между EOTF и OETF
Понятия EOTF и OETF хоть и взаимосвязаны, но служат разным целям. OETF нужна для представления захваченной сцены, из которого мы потом можем реконструировать исходное линейное освещение (это представление концептуально является буфером кадра HDR (High Dynamic Range) обычной игры). Что происходит на этапах производства обычного фильма:
  • Захват данных сцены
  • Инвертирование OETF для восстановления значений линейного освещения
  • Цветокоррекция
  • Мастеринг под различные целевые форматы (DCI-P3, Rec. 709, HDR10, Dolby Vision и т.д.):
    • Уменьшение динамического диапазона материала для соответствия динамическому диапазону целевого формата (тональная компрессия)
    • Преобразование в цветовой пространство целевого формата
    • Инвертирование EOTF для материала (при использовании EOTF в устройстве отображения изображение восстанавливается как нужно).
Подробное обсуждение этого техпроцесса не войдёт в нашу статью, но я рекомендую изучить подробное формализованное описание рабочего процесса ACES (Academy Color Encoding System).

До текущего момента стандартный техпроцесс игры выглядел следующим образом:

  • Рендеринг
  • Буфер кадра HDR
  • Тональная коррекция
  • Инвертирование EOTF для предполагаемого устройства отображения (обычно sRGB)
  • Цветокоррекция
В большинстве игровых движков используется метод цветокоррекции, популяризованный презентацией Нэти Хофмана (Naty Hoffman) «Color Enhancement for Videogames» с Siggraph 2010. Этот метод был практичен, когда использовался только целевой SDR (Standard Dynamic Range), и он позволял использовать для цветокоррекции ПО, уже установленное на компьютерах большинства художников, например Adobe Photoshop.


Стандартный рабочий процесс цветокоррекции SDR (изображение принадлежит Джонатану Блоу (Jonathan Blow))

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

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

Видеостандарты

Rec. 709
Большинство стандартов, относящихся к вещанию видеосигналов, выпущено Меж­ду­на­род­ным союзом элект­рос­вя­зи (International Telecommunication Union, ITU), органом ООН, в основном занимающимся информационными технологиями.

Рекомендация ITU-R BT.709 , которую чаще называют Rec. 709 — это стандарт, описывающий свойства HDTV. Первая версия стандарта была выпущена в 1990 году, последняя — в июне 2015 года. В стандарте описываются такие параметры, как соотношения сторон, разрешения, частота кадров. С этими характеристиками знакомо большинство людей, поэтому я не буду рассматривать их и сосредоточусь на разделах стандарта, касающихся воспроизведения цвета и яркости.

В стандарте подробно описана цветность, ограниченная цветовым пространством xyY CIE. Красный, зелёный и синий источники освещения соответствующего стандарту дисплея должны быть выбраны таким образом, чтобы их отдельные координаты цветности были следующими:

Их относительная интенсивность должна быть настроена таким образом, чтобы белая точка имела цветность

(Эта белая точка также известна как CIE Standard Illuminant D65 и аналогична захвату координат цветности распределения спектральной интенсивности обычного дневного освещения.)

Свойства цветности можно визуально представить следующим образом:


Охват Rec. 709

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

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

Здесь есть две проблемы:

  1. Не существует спецификации о том, чему соответствует физическая яркость L = 1
  2. Несмотря на то, что это стандарт вещания видео, в нём не указана EOTF
Так получилось исторически, потому что считалось, что устройство отображения, т.е. телевизор потребителя и есть EOTF. На практике это осуществлялось корректировкой диапазона захваченной яркости в вышеприведённой OETF, чтобы изображение выглядело хорошо на эталонном мониторе со следующей EOTF:

Где L = 1 соответствует яркость примерно 100 кд / м² (единицу кд / м² в этой отрасли называют «нит»). Это подтверждается ITU в последних версиях стандарта следующим комментарием:

В стандартной производственной практике функция кодирования источников изображения регулируется таким образом, чтобы конечное изображение имело требуемый вид, соответствующий видимому на эталонном мониторе. В качестве эталонной принимается функция декодирования из Рекомендации ITU-R BT.1886. Эталонная среда просмотра указана в Рекомендации ITU-R BT.2035.
Rec. 1886 — это результат работ по документации характеристик ЭЛТ-мониторов (стандарт опубликован в 2011 году), т.е. является формализацией существующей практики.


Кладбище слонов ЭЛТ

Нелинейность яркости как функции приложенного напряжения привела к тому, как физически устроены ЭЛТ-мониторы. По чистой случайности эта нелинейность (очень) приблизительно является инвертированной нелинейностью восприятия яркости человеком. Когда мы перешли к цифровому представлению сигналов, это привело к удачному эффекту равномерного распределения ошибки дискретизации по всему диапазону яркости.

Rec. 709 рассчитана на использование 8-битного или 10-битного кодирования. В большинстве контента используется 8-битное кодирование. Для него в стандарте указано, что распределение диапазона яркости сигнала должно распределяться в кодах 16-235.

HDR10

Что касается HDR-видео, то в нём есть два основных соперника: Dolby Vision и HDR10. В этой статье я сосредоточусь на HDR10, потому что это открытый стандарт, который быстрее стал популярным. Этот стандарт выбран для Xbox One S и PS4.

Мы снова начнём с рассмотрения используемой в HDR10 части цветности цветового пространства, определённой в Рекомендации ITU-R BT.2020 (UHDTV). В ней указаны следующие координаты цветности основных цветов:

И снова в качестве белой точки используется D65. При визуализации на схеме xy Rec. 2020 выглядит следующим образом:


Охват Rec. 2020

Очевидно заметно, что охват этого цветового пространства значительно больше, чем у Rec. 709.

Теперь мы переходим к разделу стандарта о яркости, и здесь снова всё становится более интересным. В своей кандидатской диссертации 1999 года “Contrast sensitivity of the human eye and its effect on image quality” («Контрастная чувствительность человеческого глаза и её влияние на качество изображения») Питер Бартен представил немного пугающее уравнение:

(Многие переменные этого уравнения сами по себе являются сложными уравнениями, например, яркость скрывается внутри уравнений, вычисляющих E и M).

Уравнение определяет, насколько чувствителен глаз к изменению контрастности при различной яркости, а различные параметры определяют условия просмотра и некоторые свойства наблюдателя. «Минимальная различаемая разница» (Just Noticeable Difference, JND) обратна уравнению Бартена, поэтому для дискретизации EOTF, чтобы избавиться от привязки к условиям просмотра, должно быть верно следующее:

Общество инженеров кино и телевидения (Society of Motion Picture and Television Engineers, SMPTE) решило, что уравнение Бартена будет хорошей основой для новой EOTF. Результатом стало то, что мы сейчас называем SMPTE ST 2084 или Perceptual Quantizer (PQ).

PQ был создан выбором консервативных значений для параметров уравнения Бартена, т.е. ожидаемых типичных условий просмотра потребителем. Позже PQ был определён как дискретизация, которая при заданном диапазоне яркости и количестве сэмплов наиболее точно соответствует уравнению Бартена с выбранными параметрами.

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

Для максимальной яркости в 10 000 нит с использованием 12-битной дискретизации (которая используется в Dolby Vision) результат выглядит следующим образом:


EOTF PQ

Как можно заметить, дискретизация не занимает весь диапазон яркости.

В стандарте HDR10 тоже используется EOTF PQ, но с 10-битной дискретизацией. Этого недостаточно, чтобы оставаться ниже порога Бартена в диапазоне яркости в 10 000 нит, но стандарт позволяет встраивать в сигнал метаданные для динамической регуляции пиковой яркости. Вот как 10-битная дискретизация PQ выглядит для разных диапазонов яркости:


Разные EOTF HDR10

Но даже так яркость немного выше порога Бартена. Однако ситуация не настолько плоха, как это может показаться из графика, потому что:

  1. Кривая логарифмическая, поэтому относительная погрешность на самом деле не так велика
  2. Не стоит забывать, что параметры, взятые для создания порога Бартена, выбраны консервативно.
На момент написания статьи телевизоры с HDR10, представленные на рынке, обычно имеют пиковую яркость 1000-1500 нит, и для них достаточно 10 бит. Стоит также заметить, что изготовители телевизоров могут сами решать, что им делать с яркостями выше диапазона, который они могут отображать. Некоторые придерживаются подхода с жёсткой обрезкой, другие — с более мягкой.

Вот пример того, как выглядит 8-битная дискретизация Rec. 709 с пиковой яркостью 100 нит:


EOTF Rec. 709 (16-235)

Как можно видеть, мы намного выше порога Бартена, и, что важно, даже самые неразборчивые покупатели будут настраивать свои телевизоры на значительно большие 100 нит пиковые яркости (обычно на 250-400 нит), что поднимет кривую Rec. 709 ещё выше.

В заключение

Одно из самых больших различий между Rec. 709 и HDR в том, что яркость последнего указывается в абсолютных значениях. Теоретически это означает, что контент, предназначенный для HDR, будет выглядеть одинаково на всех совместимых телевизорах. По крайней мере, до их пиковой яркости.

Существует популярное заблуждение, что HDR-контент в целом будет ярче, но в общем случае это не так. HDR-фильмы чаще всего будут изготавливаться таким образом, чтобы средний уровень яркости изображения был тем же, что и для Rec. 709, но так, чтобы самые яркие участки изображения были более яркими и детальными, а значит, средние тона и тени будут более тёмными. В сочетании с абсолютными значениями яркости HDR это означает, что для оптимального просмотра HDR нужны хорошие условия: при ярком освещении зрачок сужается, а значит, детали на тёмных участках изображения будет сложнее разглядеть.

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

Из рисунка видно, что сочетание зелёного и красного дают жёлтый цвет, сочетание зелёного и синего — голубой, а сочетание всех трёх цветов — белый. Из этого можно сделать вывод о том, что цвета в RGB складываются субтрактивно.

Основные цвета взяты из биологии человека. То есть, эти цвета основаны на физиологической реакции человеческого глаза на свет. Человеческий глаз имеет фоторецептор клеток, реагирующих на наиболее зеленый (М), желто-зеленый (L) и сине-фиолетовый (S) света (максимальная длин волн от 534 нм, 564 нм и 420 нм соответственно). Человеческий мозг может легко отличить широкий спектр различных цветов на основе различий в сигналах, полученных от трех волн.

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

В режиме 16 бит на пиксель, также известном как Highcolor, есть либо 5 бит на цвет (часто упоминается как 555 режим) или с дополнительным битом для зеленого цвета (известен как 565 режим). Дополнен зеленый цвет из-за того, что человеческий глаз имеет способность выявлять больше оттенков зеленого, чем любого другого цвета.

RGB значения, представленные в режиме 24 бит на пиксель (bpp), известном также под именем Truecolor, обычно выделяется три целых значения между 0 и 255. Каждое из этих трех чисел представляет собой интенсивность красного, зеленого и синего соответственно.

В RGB — три канала: красный, синий и зелёный, т.е. RGB — трёхканальная цветовая модель. Каждый канал может принимать значения от 0 до 255 в десятичной или, что ближе к реальности, от 0 до FF в шестнадцатеричной системах счисления. Это объясняется тем, что байт, которым кодируется канал, да и вообще любой байт состоит из восьми битов, а бит может принимать 2 значения 0 или 1, итого 28=256. В RGB, например, красный цвет может принимать 256 градаций: от чисто красного (FF) до чёрного (00). Таким образом несложно подсчитать, что в модели RGB содержится всего 2563 или 16777216 цветов.

В RGB три канала, и каждый кодируется 8-ю битами. Максимальное, FF (или 255) значение даёт чистый цвет. Белый цвет получается путём сочетания всех цветов, точнее, их предельных градаций. Код белого цвета = FF(красный) + FF(зелёный) + FF(синий). Соответственно код чёрного = 000000. Код жёлтого = FFFF00, пурпурного = FF00FF, голубого = 00FFFF.

Также есть еще 32 и 48 битные режимы отображения цветов.

RGB не используется для печати на бумаге, вместо нее существует CMYK-цветовое пространство.

CMYK — это цветовая модель используемая в цветной печати. Цветовая модель является математической моделью для описания цветов целыми числами. CMYK модель построена на голубом, пурпурном, желтом и черном цветах.

Ярко красный цвет код

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

Настольные и портативные цифровые устройства поддерживают цветовую модель RGB. RGB означает красный, зеленый и синий, и только эти три цвета используются для воспроизведения всех других цветов для цифровых дисплеев. Цветовой код шестнадцатеричного цвета — 6-значный цветовой код с префиксом хеша (#), который содержит цифровую информацию о цвете.

Цветовой код Hex содержит числовые значения от 0 до 9 и алфавитные значения от A до F, где 0 более темный цвет, а F более светлый.

Помимо этого F представляет проявление оттенка, а 0 — отсутствие оттенка. В приведенной ниже таблице показан оттенок красного канала.

Как видно из диаграмм, интенсивность яркости и оттенка увеличивается от 0 до F и уменьшается от F до 0. Цветовой код #000000 показывает истощение оттенка и преобладании темноты, а цветовой код #FFFFFF показывает увеличение оттенка и яркости. В шестнадцатеричном цветовом коде первые две цифры обозначают красный канал, третий и четвертый — зеленый, а последние две цифры обозначают синий канал.

Шестнадцатеричные цветовые коды — прописываются через шесть цифр: Красный основной, Красный Малый, Зеленый основной, Зеленый второстепенный, Синий основной и Синий второстепенный. Основная цифра определяет, будет ли получающийся цвет оттенком красного, зеленого или синего; а младшая цифра определяет оттенок или тон этого цвета. Цифры с более высоким значением более яркие и насыщенные, а цифры с более низким значением темные и ненасыщенные.

Шестнадцатеричный цветовой код #3F51B5 приведет к оттенку синего, так как основная цифра синего имеет самое яркое значение по сравнению с красным и зеленым. Пример можно увидеть в графическом представлении ниже —

В цветовом коде # FF0000 основные и второстепенное значение для красного канала — это F, который обозначает наиболее яркий оттенок и тон. Цифры для двух других каналов равны 0, которые будут отображать истощение их оттенков и нулевое значение для яркости, поэтому интерпретируемый цвет в модели RGB будет самым ярким оттенком красного.

Точно так же интерпретируемые результаты для шестнадцатеричных кодов #00FF00 и #0000FF будут соответственно зелеными и синими цветам.

Давайте рассмотрим еще несколько шестнадцатеричных цветовых кодов, которые интерпретируются, когда два канала в модели RGB находятся на самом ярком уровне.
Желтый — # FFFF00
Фиолетовый — # FF00FF
Бирюзовый — # 00FFFF

Если шестнадцатеричный цветовой код написан как «# FC3», он будет интерпретироваться как «# FFCC33».

Если все значения шестнадцатеричных кодов одинаковы, это приведет к появлению серых оттенков.

Шестнадцатеричные цветовые коды — резюме

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

Ярко красный цвет код

Утилита ColorGet позволяет определить цвет пикселя не только на фото или картинке, но и на любой рабочей поверхности. Программа работает без установки. Просто скачайте архив и распакуйте. Скачать ColorGet

Названия цветов и html коды

  • Ализариновый красный, Alizarin Crimson, #E32636
  • Янтарный, Amber, #FFBF00
  • Аметистовый, Amethyst, #9966CC
  • Спаржа, Asparagus, #7BA05B
  • Морской волны, Aqua, #00FFFF
  • Аквамариновый, Aquamarine, #7FFFD4
  • Лазурный, Azure, #007FFF
  • Бежевый, Beige, #F5F5DC
  • Бистр, Bistre, #3D2B1F
  • Чёрный, Black, #000000
  • Синий, Blue, #0000FF
  • Вода пляжа Бонди, Bondi Blue, #0095B6
  • Латунный, Brass, #B5A642
  • Ярко-зелёный, Bright green, #66FF00
  • Ярко-бирюзовый, Bright turquoise, #08E8DE
  • Ярко-фиолетовый, Bright violet, #CD00CD
  • Бронзовый, Bronze, #CD7F32
  • Коричневый, Brown, #964B00
  • Кожа буйвола, Buff, #F0DC82
  • Бургундский, Burgundy, #900020
  • Выгоревший оранжевый, Burnt Orange, #CC5500
  • Сиена жжёная, Burnt Sienna, #E97451
  • Умбра жжёная, Burnt umber, #8A3324
  • Камуфляжный зелёный, Camouflage green, #78866B
  • Кардинал, Cardinal, #C41E3A
  • Карминово-красный, Carmine, #960018
  • Морковный, Carrot, #ED9121
  • Серо-зелёный, Celadon, #ACE1AF
  • Светлая вишня, Cerise, #DE3163
  • Лазурный, Cerulean, #007BA7
  • Лазурно-синий, Cerulean blue, #2A52BE
  • Салатовый / Шартрез, Chartreuse, #7FFF00
  • Каштановый, Chestnut, #CD5C5C
  • Шоколадный, Chocolate, #D2691E
  • Коричневый, Cinnamon, #7B3F00
  • Кобальт синий, Cobalt, #0047AB
  • Медный, Copper, #B87333
  • Коралловый, Coral, #FF7F50
  • Кукурузный, Corn, #FBEC5D
  • Васильковый, Cornflower blue, #6495ED
  • Кремовый, Cream, #FFFDD0
  • Малиновый, Crimson, #DC143C
  • Циан, васильковый, Cyan, #00FFFF
  • Тёмно-коричневый, Dark brown, #654321
  • Тёмно-лазурный, Dark cerulean, #08457E
  • Тёмно-каштановый, Dark chestnut, #986960
  • Тёмно-коралловый, Dark coral, #CD5B45
  • Тёмно-золотой, Dark goldenrod, #B8860B
  • Тёмно-зелёный, Dark green, #013220
  • Тёмный индиго, Dark Indigo, #310062
  • Тёмный хаки, Dark Khaki, #BDB76B
  • Тёмно-оливковый, Dark Olive, #556832
  • Тёмный пастельно-зелёный, Dark pastel green, #03C03C
  • Тёмно-персиковый, Dark Peach, #FFDAB9
  • Тёмно-розовый, Dark pink, #E75480
  • Тёмная лососина, Dark salmon, #E9967A
  • Тёмно-алый, Dark Scarlet, #560319
  • Тёмно-аспидный серый, Dark slate gray, #2F4F4F
  • Тёмный весенне-зелёный, Dark spring green, #177245
  • Тёмный жёлто-коричневый, Dark tan, #918151
  • Тёмно-мандариновый, Dark tangerine, #FFA812
  • Тёмный зелёный чай, Dark Tea Green, #BADBAD
  • Тёмно-бирюзовый, Dark turquoise, #116062
  • Тёмно-фиолетовый, Dark violet, #423189
  • Голубой, Deep sky blue, #00BFFF
  • Джинсовый синий, Denim, #1560BD
  • Защитно-синий, Dodger blue, #1E90FF
  • Изумрудный, Emerald, #50C878
  • Баклажановый, Eggplant, #990066
  • Зелёный папоротник, Fern green, #4F7942
  • Льняной, Flax, #EEDC82
  • Фуксия, Magenta (Fuchsia), #FF00FF
  • Гуммигут, Gamboge, #E49B0F
  • Золотой, Gold, #FFD700
  • Золотисто-берёзовый, Goldenrod, #DAA520
  • Серый, Gray, #808080
  • Серая спаржа, Gray-asparagus, #465945
  • Зелёный серый чай, Gray-Tea Green, #CADABA
  • Зелёный, Green, #00FF00
  • Жёлто-зелёный, Green-yellow, #ADFF2F
  • Синий Градуса, Gradus Blue, #007DFF
  • Гелиотроп, Heliotrope, #DF73FF
  • Ярко-розовый, Hot pink, #FC0FC0
  • Индиго, Indigo, #4B0082
  • Международный (сигнальный) оранжевый, International orange (Safety orange), #FF4F00
  • Жёлто-зелёный, Jade, #00A86B
  • Хаки, Khaki, #C3B091
  • Синий Клейна, Klein Blue, #3A75C4
  • Лаванда, Lavender, #E6E6FA
  • Розово-лавандовый, Lavender Blush, #FFF0F5
  • Лимонный, Lemon, #FDE910
  • Лимонно-кремовый, Lemon Cream, #FFFACD
  • Светло-коричневый, Light brown, #CD853F
  • Сиреневый, Lilac, #C8A2C8
  • Лайм, Lime, #CCFF00
  • Льняной, Linen, #FAF0E6
  • Малахитовый, Malachite, #0BDA51
  • Коричнево-малиновый, Maroon, #800000
  • Розовато-лиловый, Mauve, #993366
  • Полуночно-синий, Midnight Blue, #003366
  • Зелёная мята, Mint Green, #98FF98
  • Зелёный мох, Moss green, #ADDFAD
  • Розовый Маунтбэттена, Mountbatten pink, #997A8D
  • Горчичный, Mustard, #FFDB58
  • Белый навахо, Navajo white, #FFDEAD
  • Тёмно-синий, Navy blue, #000080
  • Охра, Ochre, #CC7722
  • Старое золото, Old Gold, #CFB53B
  • Оливковый, Olive, #808000
  • Нежно-оливковый, Olive Drab, #6B8E23
  • Оранжевый, Orange, #FFA500
  • Орхидея, Orchid, #DA70D6
  • Бледно-синий, Pale Blue, #AFEEEE
  • Бледно-коричневый, Pale brown, #987654
  • Бледно-карминный, Pale carmine, #AF4035
  • Бледно-каштановый, Pale chestnut, #DDADAF
  • Бледно-васильковый, Pale cornflower blue, #ABCDEF
  • Бледно-пурпурный, Pale magenta, #F984E5
  • Бледный розовато-лиловый, Pale mauve, #996666
  • Бледно-розовый, Pale pink, #FADADD
  • Лиловый, Pale red-violet, #DB7093
  • Бледно-песочный, Pale Sandy Brown, #DABDAB
  • Палевый, Pale yellow, #F0DC82
  • Панг, Pang, #C7FCEC
  • Побег папайи, Papaya whip, #FFEFD5
  • Пастельно-зелёный, Pastel green, #77DD77
  • Пастельно-розовый, Pastel pink, #FFD1DC
  • Персиковый, Peach, #FFE5B4
  • Оранжево-персиковый, Peach-orange, #FFCC99
  • Жёлто-персиковый, Peach-yellow, #FADFAD
  • Грушевый, Pear, #D1E231
  • Барвинок, Periwinkle, #CCCCFF
  • Персидский синий, Persian blue, #6600FF
  • Зелёная сосна, Pine Green, #01796F
  • Розовый, Pink, #FFC0CB
  • Оранжево-розовый, Pink-orange, #FF9966
  • Сливовый, Plum, #660066
  • Пороховая синь, Powder blue, #003399
  • Красновато-коричневый, Puce, #CC8899
  • Берлинская лазурь, Prussian blue, #003153
  • Тыква, Pumpkin, #FF7518
  • Пурпурный, Purple, #660099
  • Умбра, Raw umber, #734A12
  • Красный, Red, #FF0000
  • Фиолетово-красный, Red-violet, #C71585
  • Яйца дрозда, Robin egg blue, #00CCCC
  • Королевский синий, Royal Blue, #4169E1
  • Красновато-коричневый, Russet, #755A57
  • Ржаво-коричневый, Rust, #B7410E
  • Сигнальный оранжевый, Safety Orange (Blaze Orange), #FF9900
  • Шафрановый, Saffron, #F4C430
  • Сапфировый, Sapphire, #082567
  • Лососёвый, Salmon, #FF8C69
  • Песочный, Sandy brown, #F4A460
  • Сангрия, Sangria, #92000A
  • Алый, Scarlet, #FF2400
  • Жёлтого школьного автобуса, School bus yellow, #FFD800
  • Зелёное море, Sea Green, #2E8B57
  • Морской пены, Seashell, #FFF5EE
  • Отборный жёлтый, Selective yellow, #FFBA00
  • Сепия, Sepia, #704214
  • Серебряный, Silver, #C0C0C0
  • Серый шифер, Slate gray, #708090
  • Зелёная весна, Spring Green, #00FF7F
  • Синяя сталь, Steel blue, #4682B4
  • Болотный, Swamp green, #ACB78E
  • Загара, Tan, #D2B48C
  • Краснобуро-оранжевый, Tenne, #CD5700
  • Мандариновый, Tangerine, #FFCC00
  • Зелёный чай, Tea Green, #D0F0C0
  • Сине-зелёный, Teal, #008080
  • Чертополох, Thistle, #D8BFD8
  • Бирюзовый, Turquoise, #30D5C8
  • Тициановый, Titian, #d53e07
  • Ультрамариновый, Ultramarine, #120A8F
  • Киноварь, Vermilion, #FF4D00
  • Фиолетовый, Violet, #8B00FF
  • Фиолетово-баклажанный, Violet-eggplant, #991199
  • Ядовито-зелёный, Viridian, #40826D
  • Пшеничный, Wheat, #F5DEB3
  • Белый, White, #FFFFFF
  • Глициния, Wisteria, #C9A0DC
  • Жёлтый, Yellow, #FFFF00
  • Циннвальдит, Zinnwaldite, #EBC2AF
  • Сомон, Saumon, #EFAF8C
  • Кофейный, Coffee, #442D25
  • Медвежьего ушка, Byron, #834D18
  • Кирпичный, Brick, #884535
  • Терракотовый, Terracotta, #904D30
  • Камелопардовый, Camelopardalis, #A25F2A
  • Ванильный, Vanilla, #D5713F
  • Рыжий, Reddish-brown, #D77D31
  • Сиена, Siena, #E28B00
  • Последний вздох Жако, Jaco, #FF9218
  • Жёлто-розовый, Yellow Pink, #FFE4B2
  • Бедра испуганной нимфы, Scared nymph, #FAEEDD
  • Сливочный, Light cream, #F2E8C9
  • Пергидрольной блондинки, Perhydor, #EEE6A3
  • Шамуа, Chamois, #A08040
  • Тёмно-грушевый, Dark pear, #D8A903
  • Детской неожиданности, Child’s surprise, #F7F21A
  • Вердепешевый, Vert-de-pеche, #DAD871
  • Слоновой кости, Ivory, #FFFDDF
  • Травяной, Grass, #5DA130
  • Влюбленной жабы, Toad in love, #3CAA3C
  • Вердепомовый, Vert-de-pomme, #34C924
  • Фисташковый, Pistachio, #BEF574
  • Красного моря, Red Sea, #1F4037
  • Лягушки в обмороке, Fainted frog, #7B917B
  • Маренго, Marengo, #4C5866
  • Мурена, Moray, #1C6B72
  • Электрик, Electric, #7DF9FF
  • Светло-серый, Light Grey, #BBBBBB
  • Кварцевый, Quartz, #99958C
  • Антрацитовый, Anthracite, #464451
  • Чёрного моря, Black Sea, #1A4780
  • Сизый, Bluish, #79A0C1
  • Ниагара, Niagara, #9DB1CC
  • Небесный, Sky, #7FC7FF
  • Гридеперлевый, Gris de perle, #C7D0CC
  • Бороды Абдель-Керима, Abdel Kerim’s beard, #D5D5D5
  • Серобуромалиновый, Seroburomalinovyj, #735184
  • Фиалковый, Violaceous, #EA8DF7
  • Звезды в шоке, Shocked star, #FF47CA
  • Вишнёвый, Cherry, #911E42
  • Блошиного брюшка, Flea belly, #4E1609
  • Бурый, Fulvous, #45161C
  • Бисмарк-фуриозо, Bismarck-furious, #A5260A
  • Бордовый, Wine red, #9B2D30
  • #ffffff Выбрать цвет
  • #bbbbbb Выбрать цвет
  • #888888 Выбрать цвет
  • #444444 Выбрать цвет
  • #000000 Выбрать цвет
  • Ярко красный цвет код

    Теги HTML

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

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

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

    • Если значения компонент цвета одинаковы (например: #d6d6d6), то получится серый оттенок. Чем больше число, тем светлее цвет, значения при этом меняются от #000000 (черный) до #ffffff (белый).
    • Ярко-красный цвет образуется, если красный компонент сделать максимальным (ff), а остальные компоненты обнулить. Цвет со значением #ff0000 самый красный из возможных красных оттенков. Аналогично обстоит с зеленым цветом (#00ff00) и синим (#0000ff).
    • Желтый цвет (#ffff00) получается смешением красного с зеленым. Это хорошо видно на цветовом круге (рис. 1), где представлены основные цвета (красный, зеленый, синий) и комплиментарные или дополнительные. К ним относятся желтый, голубой и фиолетовый (еще называемым пурпурным). Вообще, любой цвет можно получить смешением близлежащих к нему цветов. Так, голубой (#00ffff) получается за счет объединения синего и зеленого цвета.

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

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

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

    Веб-цвета

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

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

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

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

    Cincinnati Reds Цветовые коды Hex, RGB и CMYK

    Цвета Cincinnati Reds — красный, черный и белый. Цвета команды Cincinnati Reds в Hex, RGB и CMYK можно найти ниже. Цинциннати Редс — команда из Цинциннати, штат Огайо. Самые большие соперники Цинциннати Редз — Сент-Луис Кардиналс.

    Основные цвета логотипа Cincinnati Reds

    Основные цвета красных цветов Цинциннати можно найти в таблице ниже.

    RED
    PANTONE: PMS 199
    Hex Цвет: # C6011F;
    RGB: (198,1,31)
    CMYK: (00,100,65,00)
    Текстиль: 18-1764 TC
    Резьба: RA-2266
    Купить подходящую краску ЧЕРНЫЙ
    PANTONE: Process Black
    Hex Color: # 000000;
    RGB: (0,0,0)
    CMYK: (00,00,00,100)
    Текстиль: 19-1102 TC
    Нить: RA-2396
    Купить подходящую краску

    Cincinnati Reds Цветовые коды Pantone

    Цвета Pantone команды Cincinnati Reds MLB: PMS 199 C для красного и PMS Process Black для черного.

    Красный цвет Цинциннати Красных цветов Pantone представлен ниже.

    PMS 199 C

    Черный цвет Pantone красных цветов Цинциннати представлен ниже.

    PMS Process Черный

    Цветовые обозначения Pantone для красок Цинциннати Цветовой код Pantone для красок Цинциннати
    Красный PMS 199 C
    Черный PMS Process Black

    Цветовые коды Cincinnati Reds

    Шестнадцатеричные коды цветов Cincinnati Reds: # C6011F для красного, # 000000 для черного и #FFFFFF для белого.

    Красный HEX цветовой код бейсбольной команды Cincinnati Reds можно найти ниже.

    # C6011F

    Черный шестнадцатеричный цветовой код для красных цветов Цинциннати можно найти ниже.

    # 000000

    Белый шестнадцатеричный код цвета Cincinnati Reds приведен ниже.

    #FFFFFF

    HEX Цветовые обозначения для Cincinnati Reds HEX Цветовой код для Cincinnati Reds
    Красный # C6011F
    Черный # 000000
    Белый #FFFFFF

    Цветовые коды Cincinnati Reds RGB

    Коды RGB цветов Cincinnati Reds: (198,1,31) для красного, (0,0,0) для черного и (255,255,255) для белого цвета.

    Красный цветовой код RGB для красных цветов Цинциннати можно найти ниже.

    (198,1,31)

    Черный цветовой код RGB для красных цветов Цинциннати можно найти ниже.

    (0,0,0)

    Белый цветовой код RGB для красных цветов Цинциннати можно найти ниже.

    (255 255 255)

    Названия цветов RGB для красных цветов Цинциннати Код цветов RGB для красных красок Цинциннати
    Красный (198,1,31)
    Черный (0,0,0)
    Белый (255,255,255)

    Цветовые коды Cincinnati Reds CMYK

    Коды CMYK цветов Cincinnati Reds: (00,100,65,00) для красного, (00,00,00,100) для черного и (00,00,00,00) для белого цвета.

    Красный цветовой код CMYK для красных цветов Цинциннати можно найти ниже.

    (00,100,65,00)

    Черный цветовой код CMYK для красных цветов Цинциннати приведен ниже.

    (00,00,00,100)

    Белый цветовой код CMYK для красных цветов Цинциннати можно найти ниже.

    (00,00,00,00)

    Названия цветов CMYK для красных цветов Цинциннати Цветовой код CMYK для красок Цинциннати
    Красный (00,100,65,00)
    Черный (00,00,00,100)
    Белый (00,00,00,00)

    Цвета логотипа Cincinnati Reds

    Цвета логотипа Cincinnati Reds — красный, черный и белый.Код красного цвета для логотипа Cincinnati Reds: PANTONE: PMS 199, HEX COLOR: # C6011F, RGB: (198,1,31), CMYK: (00,100,65,00), TEXTILE: 18-1764 TC, THREAD: RA-2266. Код черного цвета для логотипа Cincinnati Reds: PANTONE: PROCESS BLACK, HEX COLOR: # 000000, RGB: (0,0,0), CMYK: (00,00,00,100), TEXTILE: 19-1102 TC, THREAD: RA-2396. Код белого цвета для логотипа Cincinnati Reds — HEX COLOR: #FFFFFF, RGB: (255,255,255), CMYK: (00,00,00,00).

    Логотип Цинциннати Редс

    Логотип Cincinnati Reds имеет красный, черный и белый цвета и стилизованный объект C в виде треугольной кости, внутри которого указано название команды.Значение логотипа Cincinnati Reds символизирует инициал Цинциннати.

    Формат изображения цветовой палитры логотипа Cincinnati Reds

    Цвета логотипа Cincinnati Reds можно найти в формате изображения ниже.

    Шрифты для логотипов Cincinnati Reds

    Шрифт логотипа Cincinnati Reds — MLB Reds. Шрифт MLB Reds используется для надписей на майке, имен игроков, номеров, логотипа команды, брендов и товаров. Varsity — ближайший бесплатный шрифт.

    Логотип Цинциннати Редс JPG

    Логотип Cincinnati Reds в формате JPG можно найти ниже.

    Чтобы загрузить логотип Cincinnati Reds в формате JPG, щелкните правой кнопкой мыши и выберите «Сохранить».

    Цинциннати Редс логотип PNG

    Логотип Cincinnati Reds в формате PNG можно найти ниже.

    Чтобы загрузить логотип Cincinnati Reds в формате PNG, щелкните правой кнопкой мыши и выберите «Сохранить».

    Проверено

    цветов пользовательского интерфейса Metro — Colorlib

    Список всех цветов Metro, как в Windows 8 и Windows Phone.

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

    Flat Metro UI и его цвета приобрели огромную популярность среди веб-дизайнеров и графических дизайнеров, и даже Apple решила создать пользовательский интерфейс с плоским дизайном для своей мобильной операционной системы, начиная с iOS7. Если вы еще не знакомы с Metro и Flat тенденции дизайна, возможно, вы захотите найти дополнительную информацию об этом. К счастью, мы познакомили вас с основными цветами Metro, их цветовыми кодами и основной информацией о них.

    Этот светло-зеленый цвет с шестнадцатеричным кодом # 99b433 состоит из 60% красного, 70,6% красного и 20% синего. В шкале значений RGB это означает 153 красных, 180 зеленых и 51 синий. Поскольку RGB — не единственное цветовое пространство, его можно составить из 15% голубого, 0% пурпурный, 71,7% желтый и 29,4% черный в цветовом пространстве CMYK. Цвет # 99b433 имеет угол оттенка 72,6 градуса, насыщенность 55,8% и гибкость 45,3%. Этот конкретный светло-зеленый цвет можно создать, смешав # ffff66 с # 336900 или путем смешивания # F512052 и # 3D4814.Ближайший к # 99b433 цвет для веб-безопасности — # 99cc33.

      # 99b433  
      RGB (153,180,51)  
      RGB (60%, 70,6%, 20%)  
     15, 0, 72, 29 
      hsl (72,6,55,8%, 45,3%)  
     72,6 °, 71,7, 70,6 

    Интернет Сейф

      # 99cc33  

    CIE-LAB

     69,222, -26,695, 59,165 

    XYZ

     30,055, 39,654, 9,202 

    xyY

     0.381, 0,503, 39,654 
     69,222, 64,909, 114,285 

    CIE-LUV

     69,222, -12,223, 70,765 

    Хантер-Лаборатория

     62.971, -25.004, 35.415 

    RGB двоичный

     10011001, 10110100, 00110011 

    Зеленый цвет Metro с шестнадцатеричным кодом # 00a300 и десятичным значением 41728 состоит без красного, 63,9% зеленого и синего цветов. В шкале значений RGB # 00a300 зеленый цвет не состоит из красного, 163 зеленого и синего. RGB — не единственное цветовое пространство и при использовании CMYK вы можете составить этот цвет со 100% голубым, 0% пурпурным, 100% желтым и 36.1% черный. Цвет # 99b433 имеет угол оттенка 120 градусов, насыщенность 100% и яркость 32%. Этот конкретный зеленый цвет с шестнадцатеричным кодом # 00a300 можно создать путем смешивания # 00ff00 с # 004700 или # 00E400 и # 006200. Ближайший цвет для веб-безопасности к # 00ff00 — # 009900.

      # 00a300  
      RGB (0,163,0)  
      RGB (0%, 63,9%, 0%)  
     100, 0, 100, 36 
      hsl (120,100%, 32%)  
     120 °, 100, 63.9 

    Интернет Сейф

      # 009900  

    CIE-LAB

     58,22, -61,662, 59,513 

    XYZ

     13.096, 26.193, 4.365 

    xyY

     0,3, 0,6, 26,193 
     58.22, 85.697, 136.016 

    CIE-LUV

     58,22, -55,129, 71,268 

    Хантер-Лаборатория

     51,179, -43,886, 30,768 

    RGB двоичный

     00000000, 10100011, 00000000 

    Dark Metro Green с шестнадцатеричным кодом # 1e7145 и десятичным значением 1995077 состоит из 11.8% красный, 44,3% зеленый и 27,1% синий. В шкале значений RGB # 1e7145 темно-зеленый состоит из 30 красных, 113 зеленых и 69 синих. Такой же темно-зеленый в Цветовое пространство CMYK состоит из 73,5% голубого, 0% пурпурного, 38,9% желтого и 55,7% черного. Цвет # 1e7145 имеет угол оттенка 148,2 градуса, насыщенность 58% и яркость 28%. Именно этот темно-зеленый цвет с шестнадцатеричным кодом # 1e7145 может быть составленным путем смешивания # 2A9E61 и # 124429 или смешивания # 30B56E и # 0C2D1C. Закрывает веб-безопасный цвет # 1e7145 — # 336633.

      # 1e7145  
      RGB (30,113,69)  
      RGB (11,8%, 44,3%, 27,1%)  
     73, 0, 39, 56 
      hsl (148,2,58%, 28%)  
     148,2 °, 73,5, 44,3 

    Интернет Сейф

      # 336633  

    CIE-LAB

     42,024, -35,507, 17,515 

    XYZ

     7,514, 12,515, 7,65 

    xyY

     0,271, 0,452, 12,515 
     42,024, 39.592, 153,744 

    CIE-LUV

     42,024, -32,825, 26,165 

    Хантер-Лаборатория

     35,377, -23,995, 11,943 

    RGB двоичный

     00011110, 01110001, 01000101 
    Цвет

    Metro Magenta с шестнадцатеричным кодом # ff0097 и десятичным значением 16711831 состоит из 100% красного, 0% зеленого и 59,2% синего. В шкале значений RGB # ff0097 пурпурный цвет состоит из 255 красных, 0 зеленого и 151 синего. Такой же пурпурный в цвете CMYK пространство состоит из 0% голубого, 100% пурпурного, 40.8% желтого и 0% черного. Цвет # ff0097 имеет угол оттенка 324,5 градуса, насыщенность 100% и яркость 50%. Пурпурный цвет с шестнадцатеричным кодом # ff0097 может быть составлен путем смешивания # FF00D7. и # FF0057 или смешивание # FF0073 и # FF00BB. Закрывает веб-безопасный цвет # ff0097 — # ff0099.

      # ff0097  
      RGB (255,0,151)  
      RGB (100%, 0%, 59,2%)  
     0, 100, 41, 0 
      hsl (324,5, 100%, 50%)  
     324.5 °, 100, 100 

    Интернет Сейф

      # ff0099  

    CIE-LAB

     55,583, 86,354, -8,641 

    XYZ

     46,827, 23,5, 31,347 

    xyY

     0,461, 0,231, 23,5 
     55,583, 86,786, 354,286 

    CIE-LUV

     55,583, 131,38, -28,652 

    Хантер-Лаборатория

     48,476, 87,594, -4,406 

    RGB двоичный

     11111111, 00000000, 10010111 

    Light Metro Purple с шестнадцатеричным кодом # 9f00a7 и десятичным значением 10420391 состоит из 62.4% красный, 0% зеленый и 65,5% синий. В шкале значений RGB # 9f00a7 светло-фиолетовый состоит из 159 красных, нет зеленого и 167 синих. RGB — не единственный цветовое пространство, а при использовании CMYK вы можете составить этот цвет из 4,8% голубого, 100% пурпурного, 0% желтого и 34,5% черного. Цвет # 9f00a7 имеет угол оттенка 297,1 градуса, насыщенность 100% и яркость 32,7%. Светло-фиолетовый цвет с Шестнадцатеричный код # 9f00a7 можно создать путем смешивания # DF00EA и # 5F0064 или # DF00B8 и # 5F0096. Ближайший цвет для веб-безопасности к # 9f00a7 — # 9.

      # 9f00a7  
      RGB (159,0,167)  
      RGB (62,4%, 0%, 65,5%)  
     5, 100, 0, 35 
      hsl (297,1 100%, 32,7%)  
     297,1 °, 100, 65,5 

    Интернет Сейф

      # 9  

    CIE-LAB

     38,132, 70,245, -46,733 

    XYZ

     21,273, 10,162, 37,398 

    xyY

     0,309, 0,148, 10,162 
     38.132, 84,37, 326,365 

    CIE-LUV

     38,132, 49,463, -73,581 

    Хантер-Лаборатория

     31,878, 63,326, -47,241 

    RGB двоичный

     10011111, 00000000, 10100111 

    Metro Purple с шестнадцатеричным кодом # 7e3878 и десятичным значением 8271992 состоит из 49,4% красного, 22% зеленого и 47,1% синего. В шкале значений RGB # 7e3878 pruple состоит из 126 красных, 56 зеленых и 120 синих. Тот же фиолетовый в цвете CMYK пространство состоит из 0% голубого, 55.6% пурпурный, 4,8% желтый и 50,6% черный. Цвет # 7e3878 имеет угол оттенка 305,1 градуса, насыщенность 38,5% и яркость 35,7%. Этот фиолетовый цвет с шестнадцатеричным кодом # 7e3878 может быть составлен смешивание # B04EA8 и # 4C2248 или смешивание # CA5AC0 и # 321630. Закрывает веб-безопасный цвет # 7e3878 — # 663366.

      # 7e3878  
      RGB (126,56,120)  
      RGB (49,4%, 22%, 47,1%)  
     0, 56, 5, 51 
      hsl (305.1,38.5%, 35,7%)  
     305,1 °, 55,6, 49,4 

    Интернет Сейф

      # 663366  

    CIE-LAB

     35,244, 39,407, -22,871 

    XYZ

     13,408, 8,621, 18,726 

    xyY

     0,329, 0,212, 8,621 
     35,244, 45,563, 329,87 

    CIE-LUV

     35,244, 32,902, -35,853 

    Хантер-Лаборатория

     29,361, 30,133, -17,261 

    RGB двоичный

     01111110, 00111000, 01111000 

    Dark Metro Purple с шестнадцатеричным кодом # 603cba и десятичным значением 6307002 состоит из 37.6% красный, 23,5% зеленый и 72,9% синий. В шкале значений RGB # 603cba темно-фиолетовый состоит из 96 красных, 60 зеленых и 186 синих. RGB — не единственный цветовое пространство, а при использовании CMYK вы можете составить этот цвет из 48,4% голубого, 67,7% пурпурного, 0% желтого и 27,1% черного. Цвет # 603cba имеет угол оттенка 257,1 градуса, насыщенность 51,2% и яркость 48,2%. Темно-фиолетовый цвет с Шестнадцатеричный код # 603cba можно создать путем смешивания # C0789B и # 0000D9 или # 5C789B и # 6400D9. Ближайший цвет для веб-безопасности к # 603cba — # 6633cc.

      # 603cba  
      RGB (96,60,186)  
      RGB (37,6%, 23,5%, 72,9%)  
     48, 68, 0, 27 
      hsl (257,1,51,2%, 48,2%)  
     257,1 °, 67,7, 72,9 

    Интернет Сейф

      # 6633cc  

    CIE-LAB

     36,487, 45,762, -61,119 

    XYZ

     15.301, 9.263, 47.434 

    xyY

     0,213, 0,129, 9,263 
     36.487, 76,353, 306,823 

    CIE-LUV

     36,487, 4,053, -88,795 

    Хантер-Лаборатория

     30,436, 36,475, -71,097 

    RGB двоичный

     01100000, 00111100, 10111010 

    Darken используется как черный цвет для Metro Ui. Хотя это не чисто черный цвет, он лучше смотрится в веб-дизайне и дизайне в целом. Как вы, наверное, знаете, чистого черного в природе нет, и ни в одном Metro UI его нет. Цвет Metro Darken с шестнадцатеричным кодом 1d1d1d и десятичным значением 1

    7 состоит из 11.4% красный, 11,4% зеленый и 11,4% синий. В шкале значений RGB 1d1d1d состоит из 29 красных, 29 зеленых и 29 синих. Темнее в цветовом пространстве CMYK установлено состоит из 0% голубого, 0% пурпурного, 0% желтого и 88,6% черного. Цвет 1d1d1d имеет угол оттенка 0 градусов, насыщенность 0% и яркость 11,4%. Затемнение цвета с HEX-кодом 1d1d1d можно составить путем смешивания # 292929 и # 111111 или смешивание # 2E2E2E и # 0C0C0C. Закрывает веб-безопасный цвет 1d1d1d # 333333.

      # 1d1d1d  
      RGB (29,29,29)  
      RGB (11.4%, 11,4%, 11,4%)  
     0, 0, 0, 89 
      hsl (0,0%, 11,4%)  
     0 °, 0, 11,4 

    Интернет Сейф

      # 333333  

    CIE-LAB

     10,767, -0, -0,002 

    XYZ

     1,168, 1,229, 1,338 

    xyY

     0,313, 0,329, 1,229 
     10,767, 0,002, 266,929 

    CIE-LUV

     10,767, -0,001, -0,001 

    Хантер-Лаборатория

     11,084, -0.592, 0.602 

    RGB двоичный

     00011101, 00011101, 00011101 
    Цвет

    Metro Teal с шестнадцатеричным кодом # 00aba9 и десятичным значением 6307002 состоит из 0% красного, 67,1% зеленого и 66,3% синего. В шкале значений RGB # 00aba9 бирюзовый цвет состоит из 0 красных, 171 зеленого и 169 синих. RGB — не единственное цветовое пространство и при использовании CMYK вы можете составить этот цвет из 100% голубого, 0% пурпурного, 1,2% желтого и 32,9% черного. Цвет бирюзового цвета # 00aba9 имеет угол оттенка 179,3 градуса, насыщенность 100% и яркость 33.5%. Цвет бирюзовый с ШЕСТИГРАННЫМ кодом # 00aba9 банка могут быть созданы путем смешивания # 00EFED и # 006765 или # 008B89 и # 00CBC9. Ближайший цвет для веб-безопасности к # 00aba9 — # 009999.

      # 00aba9  
      RGB (0,171,169)  
      RGB (0%, 67,1%, 66,3%)  
     100, 0, 1, 33 
      hsl (179,3 100%, 33,5%)  
     179,3 °, 100, 67,1 

    Интернет Сейф

      # 009999  

    CIE-LAB

     63.333, -36,256, -9,455 

    XYZ

     21,722, 31,988, 42,563 

    xyY

     0,226, 0,332, 31,988 
     63,333, 37,469, 194,617 

    CIE-LUV

     63,333, -49,197, -8,898 

    Хантер-Лаборатория

     56,558, -30,421, -5,029 

    RGB двоичный

     00000000, 10101011, 10101001 
    Цвет

    Light Metro Blue с шестнадцатеричным кодом цвета # eff4ff и десятичным значением 15725823 создается путем смешивания 93,7% красного, 95.7% зеленый и 100% синий. В цветовом пространстве CMYK # eff4ff голубой состоит из 6,3% голубого, 4,3% пурпурного, 0% желтого и 0% черный. В стандартной шкале значений RGB # eff4ff состоит из 239 красных, 244 зеленых и 255 синих. Этот цвет также имеет угол оттенка 221,3 градуса, насыщенность 100% и яркость 96,9%. Светло-голубой цвет с шестнадцатеричным кодом # eff4ff банка могут быть созданы смешиванием # E9F3FF и # F5F5FF или # EEF0FF и # F0F8FF. Ближайший к веб-безопасности цвет # eff4ff — #ffffff.

      # eff4ff  
      RGB (239 244 255)  
      RGB (93.7%, 95,7%, 100%)  
     6, 4, 0, 0 
      hsl (221,3 100%, 96,9%)  
     221,3 °, 6,3, 100 

    Интернет Сейф

      #ffffff  

    CIE-LAB

     96,109, 0,363, -5,855 

    XYZ

     85,994, 90,272, 107,496 

    xyY

     0,303, 0,318, 90,272 
     96,109, 5,866, 273,544 

    CIE-LUV

     96,109, -3,352, -9,233 

    Хантер-Лаборатория

     95.011, -4,711, -0,573 

    RGB двоичный

     11101111, 11110100, 11111111 
    Цвет

    Metro Blue с цветовым кодом HEX # 2d89ef и десятичным значением 2984431 создается путем смешивания 17,6% красного, 53,7% зеленого и 93,7% синего. В цветовом пространстве CMYK # 2d89ef голубой состоит из 81,2% голубого, 42,7% пурпурного, 0% желтого и 6,3%. чернить. В стандартной шкале значений RGB # 2d89ef состоит из 45 красных, 137 зеленых и 239 синих. Этот цвет также имеет угол оттенка 211,5 градусов и насыщенность 85.8% и легкость 55,7%. Голубой цвет с HEX кодом # 2d89ef может быть создается путем смешивания # 00FFFF и # 5A13DF или # 009BFF и # 5A77DF. Ближайший цвет для веб-безопасности к # 2d89ef — # 3399ff.

      # 2d89ef  
      RGB (45137239)  
      RGB (17,6%, 53,7%, 93,7%)  
     81, 43, 0, 6 
      hsl (211,5,85,8%, 55,7%)  
     211,5 °, 81,2, 93,7 

    Интернет Сейф

      # 3399ff  

    CIE-LAB

     56.761, 9,293, -58,755 

    XYZ

     25.604, 24.679, 85.071 

    xyY

     0,189, 0,182, 24,679 
     56,761, 59,486, 278,988 

    CIE-LUV

     56,761, -29,898, -93,825 

    Хантер-Лаборатория

     49,678, 5,063, -66,756 

    RGB двоичный

     00101101, 10001001, 11101111 
    Цвет

    Dark Metro Blue с шестнадцатеричным кодом # 2b5797 и десятичным значением 2840471 состоит из 16,9% красного, 34,1% зеленого и 59.2% синий. В шкале значений RGB # 2b5797 темно-синий состоит из 43 красных, 87 зеленых и 151 синего. RGB — не единственный цветовое пространство, а при использовании CMYK вы можете составить этот цвет из 71,5% голубого, 42,4% пурпурного, 0% желтого и 40,8% черного. Цвет # 2b5797 имеет угол оттенка 215,6 градуса, насыщенность 55,7% и яркость 38%. Темно-синий цвет с HEX код # 2b5797 может быть создан путем смешивания # 06AEFF и # 50002F или # 064AFF и # 50642F. Ближайший цвет для веб-безопасности к # 2b5797 — # 336699.

      # 2b5797  
      RGB (43,87,151)  
      RGB (16.9%, 34,1%, 59,2%)  
     72, 42, 0, 41 
      hsl (215,6,55,7%, 38%)  
     215,6 °, 71,5, 59,2 

    Интернет Сейф

      # 336699  

    CIE-LAB

     37,048, 7,304, -39,537 

    XYZ

     9,989, 9,564, 30,596 

    xyY

     0,199, 0,191, 9,564 
     37.048, 40.206, 280.466 

    CIE-LUV

     37,048, -16,812, -56,518 

    Хантер-Лаборатория

     30.925, 3,538, -37,011 

    RGB двоичный

     00101011, 01010111, 10010111 
    Цвет

    Metro Yellow с шестнадцатеричным кодом # ffc40d и десятичным значением 16761869 состоит из 100% красного, 76,9% зеленого и 5,1% синего. В шкале значений RGB # ffc40d желтый состоит из 255 красных, 196 зеленых и 13 синих. RGB — не единственный цвет пробел, а при использовании CMYK вы можете составить этот цвет из 0% голубого, 23,1% пурпурного, 94,9% желтого и 0% черного. Цвет # ffc40d имеет угол оттенка 45,4 градуса, насыщенность 100% и яркость 52.5%. Желтый цвет с HEX кодом # ffc40d может быть создан смешиванием # FFFF1A и # FF8900 или # FFFF00 и # FF891A. Ближайший к веб-безопасности цвет # ffc40d — # ffcc00.

      # ffc40d  
      RGB (255,196,13)  
      rgb (100%, 76,9%, 5,1%)  
     0, 23, 95, 0 
      hsl (45,4 100%, 52,5%)  
     45,4 °, 94,9, 100 

    Интернет Сейф

      # ffcc00  

    CIE-LAB

     82.256, 7,897, 82,625 

    XYZ

     61.054, 60.772, 8.895 

    xyY

     0,467, 0,465, 60,772 
     82.256, 83.001, 84.541 

    CIE-LUV

     82,256, 49,768, 84,46 

    Хантер-Лаборатория

     77.957, 3.373, 47.804 

    RGB двоичный

     11111111, 11000100, 00001101 
    Цвет

    Metro Orange с цветовым кодом HEX # e3a21a и десятичным значением 14

    0 создается путем смешивания 89% красного, 63,5% зеленого и 10.2% синий. В цветовом пространстве CMYK # e3a21a оранжевый состоит из 0% голубого, 28,6% пурпурного, 88,5% желтого и 11%. чернить. В стандартной шкале значений RGB # e3a21a состоит из 227 красных, 162 зеленых и 26 синих. Этот оранжевый цвет также имеет угол оттенка 40,6 градуса, насыщенность 79,4% и яркость 49,6%. Оранжевый цвет с HEX кодом # e3a21a может быть создается путем смешивания # FFFF02 и # C74532 или # FF9B02 и # C7A932. Ближайший цвет для веб-безопасности к # e3a21a — # cc9933.

      # e3a21a  
      RGB (227,162,26)  
      rgb (89%, 63.5%, 10,2%)  
     0, 29, 89, 11 
      hsl (40,6,79,4%, 49,6%)  
     40,6 °, 88,5, 89 

    Интернет Сейф

      # cc9933  

    CIE-LAB

     71,042, 13,898, 70,827 

    XYZ

     44,786, 42,249, 6,773 

    xyY

     0,477, 0,45, 42,249 
     71.042, 72.177, 78.898 

    CIE-LUV

     71.042, 54.034, 69.973 

    Хантер-Лаборатория

     64.999, 9,243, 39,321 

    RGB двоичный

     11100011, 10100010, 00011010 
    Цвет

    Dark Metro Orange с цветовым кодом HEX # da532c и десятичным значением 14308140 получается путем смешивания 85,5% красного, 32,5% зеленого и 17,3% синего. В цветовом пространстве CMYK # da532c темно-оранжевый состоит из 0% голубого, 61,9% пурпурного, 79,8% желтого. и 14,5% черный. В стандартной шкале значений RGB # da532c состоит из 218 красных, 83 зеленых и 44 синих. Этот темно-оранжевый цвет также имеет угол оттенка 13,4 градуса, насыщенность 70.2% и легкость 51,4%. Темно-оранжевый цвет с HEX код # da532c может быть создан путем смешивания # F00B30 с # C49B28 или # F06E58 с # C43700. Ближайший цвет для веб-безопасности к # da532c — # cc6633.

      # da532c  
      RGB (218,83,44)  
      RGB (85,5%, 32,5%, 17,3%)  
     0, 62, 80, 15 
      hsl (13,4, 70,2%, 51,4%)  
     13,4 °, 79,8, 85,5 

    Интернет Сейф

      # cc6633  

    CIE-LAB

     53.252, 51.005, 48.844 

    XYZ

     32,463, 21,277, 4,78 

    xyY

     0,555, 0,364, 21,277 
     53,252, 70,621, 43,76 

    CIE-LUV

     53,252, 108,673, 38,026 

    Хантер-Лаборатория

     46,127, 44,899, 26,145 

    RGB двоичный

     11011010, 01010011, 00101100 
    Цвет

    Metro Red с шестнадцатеричным кодом цвета # ee1111 и десятичным значением 15601937 создается путем смешивания 93,3% красного, 6,7% зеленого и 6.7% синий. В цветовом пространстве CMYK # ee1111 красный состоит из 0% голубого, 92,9% пурпурного, 92,9% желтого и 6,7% черного. В стандартная шкала значений RGB # ee1111 состоит из 238 красных, 17 зеленых и 17 синих. Этот красный цвет также имеет угол оттенка 0 градусов, насыщенность 86,7% и яркость 50%. Красный цвет с шестнадцатеричным кодом # ee1111 можно создать путем смешивания # F50022 с # E72200 или # F50000 с # E72222. Ближайший цвет для веб-безопасности к # ee1111 — # ff0000.

      # ee1111  
      RGB (238,17,17)  
      RGB (93.3%, 6,7%, 6,7%)  
     0, 93, 93, 7 
      hsl (0,86,7%, 50%)  
     0 °, 92.9, 93.3 

    Интернет Сейф

      # ff0000  

    CIE-LAB

     50,244, 74,763, 59,31 

    XYZ

     35,564, 18,623, 2,252 

    xyY

     0,63, 0,33, 18,623 
     50,244, 95,432, 38,425 

    CIE-LUV

     50,244, 159,631, 34,437 

    Хантер-Лаборатория

     43.155, 71,58, 27,114 

    RGB двоичный

     11101110, 00010001, 00010001 
    Цвет

    Dark Metro Red с шестнадцатеричным кодом цвета # b91d47 и десятичным значением 12131655 создается путем смешивания 72,5% красного, 11,4% зеленого и 27,8% синего. В цветовом пространстве CMYK # b91d47 темно-красный состоит из 0% голубого, 84,3% пурпурного, 61,6% желтого и 27,5% черный. В стандартной шкале значений RGB # b91d47 состоит из 185 красных, 29 зеленых и 71 синего. Этот красный цвет также имеет угол оттенка 343,8 градуса, насыщенность 72.9% и легкость 42%. Тёмно-красный цвет с шестнадцатеричным кодом # b91d47 банка может быть создан путем смешивания # FF3A2A с # 730064 или # FF002A с # 733A64. Ближайший цвет для веб-безопасности к # b91d47 — # cc3333.

      # b91d47  
      RGB (185,29,71)  
      RGB (72,5%, 11,4%, 27,8%)  
     0, 84, 62, 27 
      hsl (343,8,72,9%, 42%)  
     343,8 °, 84,3, 72,5 

    Интернет Сейф

      # cc3333  

    CIE-LAB

     40.655, 60,85, 17,283 

    XYZ

     21,585, 11,651, 7,073 

    xyY

     0,535, 0,289, 11,651 
     40.655, 63.257, 15.856 

    CIE-LUV

     40.655, 105.183, 7.196 

    Хантер-Лаборатория

     34.133, 53.149, 11.607 

    RGB двоичный

     10111001, 00011101, 01000111 

    В пользовательском интерфейсе Metro нет разницы в белом цвете, потому что он использует чистый белый цвет с HEX-кодом #ffffff. Цвет Metro White с цветовым кодом HEX #ffffff и десятичным значением 16777215 создается путем смешивания 100% красного, 100% зеленого и 100% синий.В цветовом пространстве CMYK #ffffff белый цвет состоит из 0% голубого, 0% пурпурного, 0% желтого и 0% черного. В стандартной шкале значений RGB #ffffff состоит из 255 красных, 255 зеленых и 255 синих. Этот белый цвет также имеет угол оттенка 0. градусов, насыщенность 0% и яркость 100%. Белый цвет с шестнадцатеричным кодом #ffffff не может быть получен путем смешивания цветов. Это чистый цвет, и оставим его таким. Ближайший к веб-безопасности цвет для #ffffff — #ffffff.

      #ffffff  
      RGB (255,255,255)  
      RGB (100%, 100%, 100%)  
     0, 0, 0, 0 
      hsl (0,0%, 100%)  
     0 °, 0, 100 

    Интернет Сейф

      #ffffff  

    CIE-LAB

     100, -0, -0.009 

    XYZ

     95,047, 100, 108,897 

    xyY

     0,313, 0,329, 100 
     100, 0,009, 266,929 

    CIE-LUV

     100, -0,006, -0,013 

    Хантер-Лаборатория

     100, -5,342, 5,435 

    RGB двоичный

     11111111, 11111111, 11111111 

    Преобразование цветовых кодов (RGB, HSL, Hex, Long, CMYK)

    Я часто обнаруживаю, что конвертирую между разными форматами цветовых кодов; особенно из шестнадцатеричного в RGB и обратно.Вместо того, чтобы запускать Google и искать инструменты преобразования цвета в Интернете, я решил написать свои собственные определяемые пользователем функции в Excel, теперь я могу вычислить результат на листе.

    Функции в этом посте включают преобразование для форматов RGB, hex, HSL, CMYK и длинных форматов.

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

    Загрузите файл примера

    Я рекомендую вам загрузить файл примера для этого сообщения.Тогда вы сможете работать с примерами и увидеть решение в действии, а файл будет полезен для дальнейшего использования.


    Загрузите файл: 0006 Convert color codes.zip

    Различные форматы цветовых кодов Excel

    Даже в Excel существует четыре различных метода определения цвета; RGB, шестнадцатеричный, HSL и длинный.

    RGB

    Цветовой код RGB (красный, зеленый и синий) используется в стандартном цветовом диалоговом окне.

    Каждый красный, зеленый и синий цвета имеют 256 различных оттенков, которые при смешивании могут создавать 16 777 216 различных цветовых комбинаций.

    HSL

    В диалоговом окне стандартного цвета есть другой формат кода; используя раскрывающийся список цветовой модели , мы можем перейти на HSL. HSL использует для создания цвета H ​​ ue, S uminance и L uminance.

    HSL пытается определить цвета ближе к тому, как люди думают о цветах.

    • Оттенок — это градус на цветовом круге от 0 до 360. 0 — красный, 120 — зеленый, 240 — синий.
    • Насыщенность — процент от количества включенного цвета.100% — полноцветный, 0% — никакой цвет (т.е. все серый)
    • Яркость (или яркость) — это процент серого. 0% — черный, 100% — белый.

    К сожалению, Excel не поддерживает HSL стандартным образом. Вместо этого Excel измеряет все числа, где 0 — самое низкое, а 255 — самое большое. Но с этой причудой мы справимся.

    Длинный

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

     Sub ActiveCellColor ()
    
    MsgBox "Длинный цветовой код:" & ActiveCell.Interior.Color
    
    End Sub 

    Выберите ячейку и запустите макрос.

    Длинный код — это число от 0 до 16 777 215, где каждое отдельное число представляет цвет. Соотношение между RGB и длинным основано на простом вычислении:

    Long = Синий x 256 x 256 + Зеленый x 256 + Красный

    В качестве примера:

    • Где Красный: 33, Зеленый: 115 и Синий: 70
    • Результат рассчитывается следующим образом: 70 x 256 x 256 + 115 x 256 + 33 = 4 616 993

    Long и RGB связаны; это просто разные способы вычисления одного и того же числа.

    Hex

    Hex цветовые коды похожи на RGB, поскольку они также используют 256 оттенков для каждого отдельного цвета. Важное отличие состоит в том, что шестнадцатеричная система представляет числа от 0 до 255, используя всего два символа. Это возможно, потому что шестнадцатеричный использует Base-16.

    Обычно мы используем Base-10 в повседневной жизни, что означает, что у нас есть 10 цифр (0, 1, 2, 3, 4, 5, 6, 7, 8, 9). Например, число 14 создается по формуле (1 x основание) + 4. Основание равно 10, поэтому результат рассчитывается как (1 x 10) + 4, что равно 14.

    Для Base-16 имеется 16 цифр; однако, поскольку у нас недостаточно числовых символов, мы используем A, B, C, D, E и F для представления чисел от 10 до 15.

    В качестве примера шестнадцатеричное число AB равно 171.

    • A = 10
    • B = 11.
    • Вычисление: (A x основание) + B = (10 x 16) + 11 = 171

    В шестнадцатеричном формате наименьшее значение равно нулю, а наибольшее значение — F (т.е. равно 15). Следовательно, существует 16 возможных отдельных цифр.Это означает, что из двух цифр мы можем создать 256 оттенков (16 x 16 = 256), что совпадает с RGB. Следовательно, hex также имеет те же 16 777 216 комбинаций, что и RGB и long.

    Шестнадцатеричные коды представлены в том же порядке, что и RGB, поэтому, если шестнадцатеричный код цвета # 467321 , первые два символа представляют красный цвет, два средних символа представляют зеленый цвет, а последние два — синий.

    Используя шестнадцатеричный код # 467321 в качестве примера, преобразование в RGB будет:

    • Красный: шестнадцатеричное значение 46 вычисляется как (4 * 16) + 6 = 70
    • Зеленый: шестнадцатеричное значение 73 вычисляется как ( 7 * 16) + 3 = 115
    • Синий: шестнадцатеричное значение 21 вычисляется как (2 * 16) + 1 = 33

    Шестнадцатеричные коды используются в свойствах VBA для определения цвета.

    Цветовой код на скриншоте выше: & H00467321 &. Однако есть очень тонкая разница при использовании кода VBA … шестнадцатеричный код нужно поменять местами. Первые два символа обозначают синий цвет, два средних символа — зеленый цвет, а последние два — синий.

    Обычно синий будет # 0000FF , но для свойства VBA код будет: & H00FF0000 &

    • & = Начальный символ
    • H = Шестнадцатеричный код
    • 00 = Указывает VBA использовать собственный цвет
    • FF0000 = шестнадцатеричный цветовой код с перевернутым RGB
    • & = Конечный символ

    CMYK

    Другой распространенной системой цветового кода является CMYK.Он используется в основном для печати, так как определяет количество чернил C, ян, M, агента, Y, желтого и черного, K, , используемых для перекрытия печатных точек.

    Хотя Excel не использует CMYK, это распространенный метод, поэтому я включил его в рамки этого сообщения.

    Создавайте точный код VBA за секунды с помощью AutoMacro

    AutoMacro — это мощный генератор кода VBA, который поставляется с обширной библиотекой кода и множеством других инструментов и утилит для экономии времени.

    Если вы опытный программист, желающий сэкономить время, или новичок, просто пытающийся заставить вещи работать, AutoMacro — это инструмент для вас.

    Пользовательские функции для преобразования цветов

    В предыдущем разделе я попытался объяснить, как каждый метод определяет цвета, но преобразование между ними — это совсем другое дело, и оно намного сложнее. К счастью, мы можем позволить Excel делать всю работу за нас. Ниже приведены UDF для преобразования между различными методами.

    ПОМНИТЕ! — Для использования функций VBA код должен быть включен в стандартный модуль кода VBA.

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

    Преобразовать из RGB в шестнадцатеричный

    Следующая UDF вычисляет шестнадцатеричное значение на основе цветовых кодов RGB.

     Функция GetHexFromRGB (красный как целое, зеленый как целое, синий как целое) как строка
    
    GetHexFromRGB = "#" и VBA.Вправо $ ("00" & VBA.Hex (красный), 2) & _
        VBA.Right $ («00» и VBA.Hex (зеленый), 2) и VBA.Right $ («00» и VBA.Hex (синий), 2)
    
    Конечная функция 

    Как использовать функцию:

    Функция содержит 3 аргумента, значения от 0 до 255 для каждого отдельного значения красного, зеленого или синего.

    Преобразование из шестнадцатеричного в RGB

    UDF ниже предоставляет значение красного, зеленого или синего цвета на основе шестнадцатеричного цвета.

     Функция GetRGBFromHex (hexColor как строка, RGB как строка) как строка
    
    hexColor = VBA.Заменить (hexColor, "#", "")
    hexColor = VBA.Right $ ("000000" & hexColor, 6)
    
    Выбрать регистр RGB
    
        Дело «Б»
            GetRGBFromHex = VBA.Val ("& H" & VBA.Mid (hexColor, 5, 2))
    
        Корпус "G"
            GetRGBFromHex = VBA.Val ("& H" & VBA.Mid (hexColor, 3, 2))
    
        Корпус "R"
            GetRGBFromHex = VBA.Val ("& H" & VBA.Mid (hexColor, 1, 2))
    
    Конец Выбрать
    
    Конечная функция 

    Как использовать функцию:

    Функция содержит 2 аргумента;

    1. шестнадцатеричный код
    2. буква R, G или B для представления возвращаемого цвета

    сообщить об этом объявлении Преобразовать из RGB в длинный

    Этот UDF предоставляет длинное значение на основе цветовых кодов RGB.

     Функция GetLongFromRGB (красный как целое, зеленый как целое, синий как целое) до длины
    
    GetLongFromRGB = RGB (красный, зеленый, синий)
    
    Конечная функция 

    Как использовать функцию:

    Функция содержит 3 аргумента, значения от 0 до 255 для каждого отдельного значения красного, зеленого или синего.

    Преобразование из длинного в RGB

    Для преобразования из RGB в длинный цветовой код используйте следующий UDF.

     Функция GetRGBFromLong (longColor As Long, RGB как строка) как целое число
    
    Выбрать регистр RGB
    
        Корпус "R"
            GetRGBFromLong = (longColor Mod 256)
    
        Корпус "G"
            GetRGBFromLong = (longColor \ 256) Mod 256
    
        Дело «Б»
            GetRGBFromLong = (longColor \ 65536) Mod 256
    
    Конец Выбрать
    
    Конечная функция 

    Как использовать функцию:

    Функция содержит 2 аргумента;

    1. длинный код
    2. буква R, G или B, в зависимости от того, какой цвет мы хотим вернуть.

    Преобразование из длинного в шестнадцатеричное

    Следующая UDF предоставляет шестнадцатеричный код на основе длинного цветового кода.

     Функция GetHexFromLong (longColor As Long) As String
    
    Dim R As String
    Dim G как струна
    Dim B как строка
    
    R = Формат (Application.WorksheetFunction.Dec2Hex (longColor Mod 256), «00»)
    G = Формат (Application.WorksheetFunction.Dec2Hex ((longColor \ 256) Mod 256), «00»)
    B = Формат (Application.WorksheetFunction.Dec2Hex ((longColor \ 65536) Mod 256), «00»)
    
    GetHexFromLong = "#" & R&G & B
    
    Конечная функция 

    Как использовать функцию:

    Функция имеет только один аргумент — длинный цветовой код.

    Преобразовать из шестнадцатеричного в длинный

    UDF ниже преобразует шестнадцатеричный код в длинный цветовой код.

     Функция GetLongFromHex (hexColor As String) Как долго
    
    Dim R As String
    Dim G как струна
    Dim B как строка
    
    hexColor = VBA.Replace (hexColor, "#", "")
    hexColor = VBA.Right $ ("000000" & hexColor, 6)
    
    R = левый (hexColor, 2)
    G = средний (hexColor, 3, 2)
    B = право (hexColor, 2)
    
    GetLongFromHex = Application.WorksheetFunction.Hex2Dec (B & G & R)
    Конечная функция 

    Как использовать функцию:

    Функция имеет только один аргумент — шестнадцатеричный код.

    Преобразование из RGB в HSL

    UDF ниже вернет степень оттенка,% насыщенности или% яркости на основе цветовых кодов RGB.

     Функция GetHSLFromRGB (красный как целое, зеленый как целое, синий как целое, _
        HSL как строка)
    
    Dim RedPct как двойной
    Dim GreenPct как двойной
    Dim BluePct как двойной
    Затемнение MinRGB как двойное
    Dim MaxRGB как двойной
    Dim H как двойной
    Dim S как двойной
    Dim L как двойной
    
    RedPct = Красный / 255
    GreenPct = зеленый / 255
    BluePct = Синий / 255
    
    MinRGB = Приложение.WorksheetFunction.Min (RedPct, GreenPct, BluePct)
    MaxRGB = Application.WorksheetFunction.Max (RedPct, GreenPct, BluePct)
    
    L = (MinRGB + MaxRGB) / 2
    
    Если MinRGB = MaxRGB, то
        S = 0
    ИначеЕсли L <0,5 Тогда
        S = (MaxRGB - MinRGB) / (MaxRGB + MinRGB)
    Еще
        S = (MaxRGB - MinRGB) / (2 - MaxRGB - MinRGB)
    Конец, если
    
    
    Если S = ​​0, то
        H = 0
    ElseIf RedPct> = Application.WorksheetFunction.Max (GreenPct, BluePct) Тогда
        H = (GreenPct - BluePct) / (MaxRGB - MinRGB)
    ElseIf GreenPct> = Application.WorksheetFunction.Макс (RedPct, BluePct) Тогда
        H = 2 + (BluePct - RedPct) / (MaxRGB - MinRGB)
    Еще
        H = 4 + (RedPct - GreenPct) / (MaxRGB - MinRGB)
    Конец, если
    
    H = H * 60
    
    Если H <0, то H = H + 360
    
    Выберите Case HSL
    
        Дело "H"
            GetHSLFromRGB = H
    
        Случаи"
            GetHSLFromRGB = S
    
        Корпус "L"
            GetHSLFromRGB = L
    
    Конец Выбрать
    
    Конечная функция 

    Как использовать функцию:

    Функция содержит 4 аргумента. Значения R, G и B, затем буква H, S или L, в зависимости от значения, возвращаемого функцией.

    Расчет для преобразования в HSL основан на вычислении здесь: http://www.niwa.nu/2013/05/math-behind-colorspace-conversions-rgb-hsl/

    Преобразование из HSL в RGB

    Следующая UDF вычисляет значения RGB на основе степени оттенка,% насыщенности% яркости

     Функция GetRGBFromHSL (оттенок как двойной, насыщенность как двойной, яркость как двойная, _
        RGB как строка)
    
    Dim R как двойной
    Dim G как двойной
    Dim B как двойной
    Dim temp1 как двойной
    Dim temp2 As Double
    Dim tempR As Double
    Dim tempG как двойной
    Dim tempB как двойной
    
    Если насыщенность = 0, то
    
        R = яркость * 255
        G = яркость * 255
        B = яркость * 255
    
    GoTo ReturnValue
    
    Конец, если
    
    Если яркость <0.5 Тогда
        temp1 = Яркость * (1 + Насыщенность)
    Еще
        temp1 = Яркость + Насыщенность - Яркость * Насыщенность
    Конец, если
    
    temp2 = 2 * Яркость - temp1
    
    Оттенок = Оттенок / 360
    
    tempR = оттенок + 0,333
    tempG = оттенок
    tempB = оттенок - 0,333
    
    Если tempR <0, то tempR = tempR + 1
    Если tempR> 1, то tempR = tempR - 1
    Если tempG <0, то tempG = tempG + 1
    Если tempG> 1, то tempG = tempG - 1
    Если tempB <0, то tempB = tempB + 1
    Если tempB> 1, то tempB = tempB - 1
    
    Если 6 * tempR <1 Тогда
        R = temp2 + (temp1 - temp2) * 6 * темпR
    Еще
        Если 2 * tempR <1 Тогда
            R = temp1
        Еще
            Если 3 * tempR <2 Тогда
                R = temp2 + (temp1 - temp2) * (0.666 - темпR) * 6
            Еще
                R = temp2
            Конец, если
        Конец, если
    Конец, если
    
    Если 6 * tempG <1 Тогда
        G = temp2 + (temp1 - temp2) * 6 * tempG
    Еще
        Если 2 * tempG <1 Тогда
            G = temp1
        Еще
            Если 3 * tempG <2 Тогда
                G = temp2 + (temp1 - temp2) * (0,666 - tempG) * 6
            Еще
                G = temp2
            Конец, если
        Конец, если
    Конец, если
    
    
    Если 6 * tempB <1 Тогда
        B = temp2 + (temp1 - temp2) * 6 * tempB
    Еще
        Если 2 * tempB <1 Тогда
            B = temp1
        Еще
            Если 3 * tempB <2 Тогда
                B = temp2 + (temp1 - temp2) * (0.666 - темпB) * 6
            Еще
                B = temp2
            Конец, если
        Конец, если
    Конец, если
    
    R = R * 255
    G = G * 255
    В = В * 255
    
    
    ReturnValue:
    Выбрать регистр RGB
    
        Корпус "R"
            GetRGBFromHSL = Круглый (R, 0)
    
        Корпус "G"
            GetRGBFromHSL = Круглый (G, 0)
    
        Дело «Б»
            GetRGBFromHSL = Раунд (B, 0)
    
    Конец Выбрать
    
    Конечная функция 

    Как использовать функцию:

    Функция содержит 4 аргумента. Степень оттенка, насыщенности% и яркости%, а также буквы R, G или B в зависимости от возвращаемого значения

    Расчет для преобразования из HSL основан на вычислении отсюда: http: // www.niwa.nu/2013/05/math-behind-colorspace-conversions-rgb-hsl/

    Преобразование из RGB в CMYK

    Следующий UDF предоставляет значение% для голубого, пурпурного, желтого или черного в зависимости от цвета RGB коды.

     Функция GetCMYKFromRGB (красный как целое, зеленый как целое, синий как целое, _
        CMYK как строка) как двойной
    
    Dim K как двойной
    Dim RedPct как двойной
    Dim GreenPct как двойной
    Dim BluePct как двойной
    Dim MaxRGB как двойной
    
    RedPct = Красный / 255
    GreenPct = зеленый / 255
    BluePct = Синий / 255
    MaxRGB = Приложение.WorksheetFunction.Max (RedPct, GreenPct, BluePct)
    
    Если MaxRGB = 0 и CMYK <> "K", то
        GetCMYKFromRGB = 0
        Функция выхода
    Конец, если
    
    
    K = 1 - MaxRGB
    
    Выбрать регистр CMYK
    
        Корпус "C"
            GetCMYKFromRGB = (1 - RedPct - K) / (1 - K)
    
        Корпус "М"
            GetCMYKFromRGB = (1 - GreenPct - K) / (1 - K)
    
        Дело "Y"
            GetCMYKFromRGB = (1 - BluePct - K) / (1 - K)
    
        Корпус "К"
            GetCMYKFromRGB = K
    
    Конец Выбрать
    
    Конечная функция 

    Как использовать функцию:

    Для функции требуется 4 аргумента.Значения R, G и B, а также буквы C, M, Y или K, в зависимости от возвращаемого значения.

    Расчет для преобразования в CMYK основан на расчетах здесь: https://www.easycalculation.com/colorconverter/cmyk-rgb-color-convertor.php

    Преобразовать из CMYK в RGB

    Чтобы получить процентные значения C, M, Y или K от RGB используют UDF ниже.

     Функция GetRGBFromCMYK (C как двойное, M как двойное, Y как двойное, K как двойное, _
        RGB как строка) как целое число
    
    Выбрать регистр RGB
    
        Корпус "R"
            GetRGBFromCMYK = 255 * (1 - K) * (1 - C)
    
        Корпус "G"
            GetRGBFromCMYK = 255 * (1 - K) * (1 - M)
    
        Дело «Б»
            GetRGBFromCMYK = 255 * (1 - K) * (1 - Y)
    
    Конец Выбрать
    
    Конечная функция 

    Как использовать функцию:

    Для функции требуется 5 аргументов.Процентное содержание голубого, пурпурного, желтого и черного, а также буквы R, G или B, в зависимости от возвращаемого значения.

    Расчет для преобразования из CMYK основан на вычислении здесь: https://stackoverflow.com/questions/106/coloring-cells-in-excel-with-cmyk-cell-values ​​

    Добавление преобразования цвета -in

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

    Загрузите надстройку


    Загрузите файл: Надстройка преобразователя цветового кода

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

    После установки в меню EOTG появится значок «Конвертер» в группе «Цветовые коды».

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

    Заключение

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


    Получите нашу БЕСПЛАТНУЮ электронную книгу VBA, которая поможет вам автоматизировать Excel, чтобы вы могли сэкономить время и перестать выполнять работу, которую могла бы делать обезьяна.


    Вводя свой адрес электронной почты, вы соглашаетесь получать электронные письма от Excel Off The Grid. Мы будем уважать вашу конфиденциальность, и вы можете отказаться от подписки в любое время.


    Не забывайте:

    Если вы нашли этот пост полезным или у вас есть лучший подход, оставьте комментарий ниже.

    Вам нужна помощь в адаптации этого к вашим потребностям?

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

    Но, если вы все еще боретесь, вам следует:

    1. Читать другие блоги или смотреть видео на YouTube на ту же тему.Вы получите гораздо больше пользы, открыв свои собственные решения.
    2. Спросите «Excel Ninja» в своем офисе. Удивительно, что знают другие люди.
    3. Задайте вопрос на форуме, например в Mr Excel, или в сообществе ответов Microsoft. Помните, что люди на этих форумах обычно проводят свое время бесплатно. Так что постарайтесь сформулировать свой вопрос, сделайте его ясным и кратким. Составьте список всего, что вы пробовали, и предоставьте снимки экрана, фрагменты кода и примеры рабочих книг.
    4. Воспользуйтесь Excel Rescue, моим партнером-консультантом.Они помогают, предлагая решения небольших проблем с Excel.

    Что дальше?
    Не уходите, есть еще много чего узнать об Excel Off The Grid. Ознакомьтесь с последними сообщениями:

    220 Цветовые коды RGB - Simplicable

    Цветовой код RGB - это спецификация цвета с использованием основных цветов: красного, зеленого и синего. Это соответствует цветам, которые могут отображаться с помощью технологии на основе RGB, такой как экран мобильного устройства.Следует отметить, что одни и те же цвета RGB часто отображаются с использованием более короткого кода, известного как шестнадцатеричный. Ниже приведена полезная палитра названных цветов RGB. Бутылка Greenrgb (0,106,78) Dynasty Greenrgb (0,142,128) Флуоресцентная бирюзаgb (0,253,255) Bright Tealrgb (1,249,198) Electron Bluergb (8,129,209) Яркая бирюзаgb (8,232,222) Флуоресцентная Greenrgb (8,255,8) Экзистенциальная зеленая антенна (10,10gb) (18,225,147) Black Raspberryrgb (22,17,13) Blue Charcoalrgb (38,43,47) English Hollyrgb (39,66,52) Antarctic Bluergb (43,63,92) Black Coffeergb (59,48,47) Electric Ultramarinergb (63,0,255) Черный шоколадgb (68,17,0) Послеобеденный Teargb (89,78,64) Boring Greenrgb (99,179,101) Dusty Olivergb (100,99,86) Aquarium Bluergb (102,205,170) Ярко-зеленый rgb (102,255,0) Серый Blueberryrgb (108,128,150) Arctic Duskrgb (115,91,106) Ancient Icergb (115,253,255) Grey Cloudrgb (116,120,128) Apple Greenrgb (118,205,38) Pastel Greenrgb (119,221,119) Green Pearrgb (121,190,88) Electric Bluergb,255,137 (125,249) Umberrgb (138,51,36) Acai Juicergb (148,33,147) Bright Mintrgb (152,255,152) Pastel Tu rquoisergb (153,197,196) Bright Olivergb (156,187,4) Ярко-желтый Greenrgb (157,255,0) Bright Sea Greenrgb (159,226,191) Green Ashrgb (160,218,169) Brown Sugarrgb (161,114,73) Grey Olivergb (161,154,127,17) Earl 176,104,128) Pastel Purplergb (179,158,181) Bright Purplergb (190,3,253) Bright Maroonrgb (195,33,72) Серый Pinkrgb (195,144,155) Alloy Orangergb (196,98,16) Crushed Icergb (196,255,247) Fluorescent Yellow,255,255,255,255,255,254 Greyrgb (207,207,196) Cold Turbulencergb (207,225,239) Горький Limergb (210,219,50) Neon Yellowrgb (207,255,4) Blood Orangergb (209,0,28) Bitter Lemonrgb (207,255,0) Dusty Pinkrgb (213,138,148) Ricergb (218,189,132) Серый Ghostrgb (221,220,218) Pastel Pinkrgb (222,165,164) Paradise Pinkrgb (228,68,94) Pastel Rose Tanrgb (233,209,191) Clear Sandrgb (234,231,218) Burning Tomatorgb (235,21,2004) Almond Cooking (235,80,4008) Almond (238,205,0) измельченный ананасgb (239,204,68) клевер Honeyrgb (240,226,188) Coconut Milkrgb (240,237,229) Marshmallowrgb (240,238,228) Cloud Whitergb (242,242,237) Aragonitergb (243,241,243) Powder Rosergb (245,179,188) Moonlightrgb (246,238,77gb) Moonlightrgb (246,238,713) 70) Coconut Pulprgb (251,249,225) Conch Shellrgb (252,143,155) Butterscotchrgb (253,177,71) Яркий Pinkrgb (254,1177) Флуоресцентный Pinkrgb (254,20,147) Неоновый Fuchsiargb (254,65,100) Dusk Bl4,7r6gb (254,65,100) Dusk Oranger6gb (254,231,21) Faded Yellowrgb (254,255,127) Electric Crimsonrgb (255,0,63) Brutal Pinkrgb (255,0187) Electric Pinkrgb (255,4,144) Bright Magentargb (255,8,232) Искусственная клубникаrgb (255,67,164) Aerospace Orangergb ( 255,79,0) Fiery Rosergb (255,84,112) Флуоресцентный Redrgb (255,85,85) Brave Orangergb (255,99,28) Pastel Redrgb (255,105,97) Bright Mangorgb (255,136,48) Bright Marigoldrgb (255,141, 0) Chrome Yellowrgb (255,167,0) Fluorescent Orangergb (255,207,0) Bright Saffronrgb (255,207,9) Egg Whitergb (255,2 39,193) Абрикос Icergb (255,246,233) Ярко-желтый rgb (255,253,1) Желтый Taxirgb (255,255,51)

    Примечания

    Эту палитру можно просмотреть в шестнадцатеричном формате здесь.Шестнадцатеричный код - это более короткий код, в котором используются шестнадцатеричные числа для представления интенсивности красного, зеленого и синего цветов, соответствующей цветам RGB.

    Цветовые палитры

    Это полный список статей, которые мы написали о цветовых палитрах.

    Если вам понравилась эта страница, добавьте в закладки Simplicable.

    © 2010-2020 Простое. Все права защищены. Воспроизведение материалов, размещенных на этом сайте, в любой форме без явного разрешения запрещено.

    Просмотр сведений об авторах и авторских правах или цитировании для этой страницы.

    Удивительная наука за цветовыми кодами | Патрик Вудхед | Pilcro

    Интересный факт : Джеймс Клерк Максвелл, самый влиятельный физик XIX века, человек, который первым изобрел электромагнетизм, один из трех героев Эйнштейна наряду с Фарадеем и Ньютоном, считается отцом метода аддитивной окраски. Его исследования этой концепции привели к созданию первой цветной фотографии!

    Hex

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

    Вместо того, чтобы использовать число от 0 до 255 для количества каждого основного цвета, мы используем шестнадцатеричное десятичное представление этого числа.

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

    Шестнадцатеричные числа - это еще один способ представления чисел, точно так же, как двоичные и десятичные числа.

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

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

    Шестнадцатеричные числа представляют числа, состоящие из шестнадцати символов. От 0 до 9, а затем от A до F. После того, как мы дойдем до F, мы используем комбинации этих шестнадцати символов для выражения больших чисел.

    Например, число семнадцать равно 10001 в двоичном, 17 в десятичном и 11 в шестнадцатеричном.

    На картинке выше у нас Mint Green с шестнадцатеричным кодом # 6BBDB9.

    На изображении RGB он имеет код RGB (107, 189, 185).Если мы конвертируем эти три десятичных числа в шестнадцатеричные, мы получим (6B, BD, B9), что соответствует шестнадцатеричному коду!

    HSL

    HSL обозначает H ​​ у.е., S , L ightness. Этот подход к кодированию цветов возник в попытке избежать некоторых неинтуитивных результатов манипулирования цветами в «гамме» RGB. (Палитра - это пространство всех цветов, доступных при использовании такой цветовой схемы, как RGB).

    Проблема заключалась в том, что в модели RGB, чтобы получить более темный или более светлый оттенок, скажем, вышеупомянутого Mint Green, нужно изменить каждое из красного, зеленого и синего значений кода RGB.

    Создатели HSL посчитали, что это изменение должно быть возможным, если изменить только один циферблат, а именно яркость.

    Итак, HSL был изобретен для обеспечения более интуитивного подхода к преобразованию цвета.

    Оттенок: Это , по сути, основной цвет в цветовом спектре. Он принимает в качестве значения градус от 0 до 360 градусов, где красный - 0 (и 360) градусов, зеленый - 120 градусов, а синий - 240 градусов, а остальные цвета подходят между ними.

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

    В принципе, насколько красочен цвет?

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

    Все это звучит довольно технически, и, возможно, лучший способ описать HSL - это изображение.

    HSL. Источник: Wikipedia

    Теперь давайте посмотрим на форматы печати CMYK и Pantone.

    CMYK

    CMYK обозначает C yan, M agenta, Y ellow и либо K ey, либо Blac K .

    Это формат печати, и, как мы видели, поскольку печатаемые объекты отражают свет, но не излучают свет, нам необходимо использовать субтрактивный цветовой формат .Мы начинаем с белого листа бумаги или фона и вычитаем длины волн из белого света, который он отражает.

    Как CMYK вычитает из белого света?

    «Голубой - это дополнение красного, то есть голубой служит фильтром, поглощающим красный цвет. Количество голубого, нанесенного на белый лист бумаги, определяет, сколько красного в белом свете будет отражаться от бумаги ». -Wikipedia

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

    Происхождение K в CMYK оспаривается. Некоторые говорят, что это происходит от последней буквы Blac k , причем последняя буква выбрана вместо первой, потому что B может ввести людей в заблуждение, чтобы они думали, что это B lue. Другие говорят, что это первая буква K ey, как на клавиатуре принтера.

    Большая часть печати выполняется в формате CMYK .

    Pantone

    Pantone - единственный из наших цветовых форматов, который также является компанией!

    Pantone предлагает целый ряд цветов печати за пределами гаммы CMYK.

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

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

    Это приводит к тому, что дизайнеры используют дорогие цветные Rolodex Pantone, чтобы гарантировать, что веб-цвета соответствуют цветам печати в их работе с клиентами.

    Цветовые коды Pantone начинаются с «PMS», что означает P antone M и S ystem. Затем каждому цвету присваивается номер (например, 7472 для приведенного выше мятно-зеленого), за которым может следовать C или U, что означает C oated и U ncoated.

    Если вам понравился этот блог, пожалуйста, хлопните, чтобы поделиться им.

    Чтобы сохранить цвета вашей собственной марки во всех этих различных форматах, посетите www.pilcro.com (см. изображение ниже). После того, как вы создали свою палитру, вы можете поделиться ею со своей командой, как если бы вы делитесь документом Google.

    Вы также можете хранить множество активов других брендов на своем Pilcro Artboard!

    Психология цвета в маркетинге: полное руководство

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

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

    Но с психологией цвета не все так просто.

    Предложение вроде «желтый представляет творчество и счастье» - это не совсем цветовая психология - это обобщенная ассоциация.

    На самом деле «желтый» может иметь разные коннотации в зависимости от того, как он используется, с каким цветом находится рядом и какого оттенка желтого.

    Желтый не всегда радостен и креативен - иногда он болезненный и бледный.

    В качестве примера посмотрите всплывающее окно подписчика Visme ниже:

    Изображение всплывающего окна Visme

    Желтый цвет очень сильный - он привлекает ваше внимание и заставляет вас чувствовать себя сильнее. Сочетание этого желтого цвета с изображением рыкающего льва производит еще более сильное впечатление.

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

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

    Человеческое восприятие цвета

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

    Цветовое зрение у них развивается постепенно, примерно до 5 месяцев. Это тот возраст, когда они наконец могут увидеть все цвета. Это так рано, что цвет начинает иметь значение и восприятие.

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

    Фактически, это первое восприятие цвета присуще каждой культуре. В США розовый ассоциируется с принцессами и балеринами, в то время как в Японии розовый - это цвет цветущей сакуры, который воспринимается немного иначе.

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

    Некоторые цветовые восприятия универсальны, например, «эффект белого лабораторного халата».Этот цветовой эффект объясняет, почему большинство людей чувствуют себя в безопасности и лучше заботятся о них, когда врач носит белый лабораторный халат.

    Еще один пример восприятия цвета, заслуживающий упоминания - это логотип Coca-Cola, который узнает большинство населения мира.

    Источник изображения

    Логотип Coca-Cola белый поверх красного - крышки от бутылок красные, мерчандайзинг красный, и даже грузовики красные. Люди знают, что красный - это цвет кока-колы.

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

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

    Если бы логотип Coca-Cola однажды стал желтым, это сбило бы с толку множество людей.

    Красный цвет логотипа Coca-Cola - это суть лояльности к бренду, а это и есть суть цветовой психологии в маркетинге.Он глубоко проникает в человеческое поведение и то, как мы взаимодействуем с нашим восприятием цвета.

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

    Понимание теории цвета

    Теория цвета - это технический язык, на котором объясняется принцип работы цвета.

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

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

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

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

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

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

    • Цветовая модель для печатных материалов называется CMYK
    • .
    • Цветовая модель цифрового материала называется RGB
    • .

    Цветовая модель CMYK

    CMYK означает голубой, пурпурный, желтый и ключевой (черный).

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

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

    Когда голубой, пурпурный и желтый смешиваются вместе, получается очень темный цвет, также известный как несовершенный черный. Вот почему цветовая модель называется CMYK - K означает «ключ», или черный.

    Цветовая модель RGB

    RGB означает красный, зеленый и синий.

    Цветовое колесо RGB визуализирует перекрытие цветов на экранах. Основные цвета в RGB - это не пигменты, а цветной свет.

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

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

    Модель RGB начинается с черного, и цвета появляются, когда свет попадает на нее. Когда все три цветных индикатора перекрываются, мы видим «аддитивный» белый цвет.

    Когда дизайнер создает контент для печати, он переключается на цветовое пространство CMYK. При работе с цифровым контентом они используют RGB.

    Когда для обоих используется одно и то же содержимое, дизайнеры начинают с RGB, а затем переключаются на CMYK перед отправкой файлов на принтеры. Иногда необходимо внести коррективы в цвет, чтобы обеспечить единообразие во всех средах.

    Основные цвета в искусстве, CMYK и RGB

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

    В классическом цветовом круге три основных цвета - красный, желтый и синий.

    Теперь вам может быть интересно, почему это не относится к моделям CMYK и RGB. Это связано с тем, как человеческий глаз видит цвет.

    В конце 17 века Исаак Ньютон в своем эксперименте с призмой обнаружил, что цвет исходит от света.

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

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

    Цветные круги Буте из 1708

    Цветовая модель CMYK была представлена ​​в начале 20 века компанией Eagle Printing Ink Company.

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

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

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

    Цветовая модель RGB была внедрена в экраны цветных телевизоров. Если вы достаточно взрослые, вы, вероятно, помните, что, когда вы очень внимательно смотрели на экран телевизора, вы могли видеть красный, зеленый и синий прямоугольники.

    Что происходит при сочетании цветов?

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

    В этом разделе мы рассмотрим основные цветовые комбинации, цветовые гармонии и то, как сгруппировать цвета удобным способом.

    Есть две основные цветовые комбинации: вторичная и третичная.

    Дополнительные цвета

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

    Третичные цвета

    Третичные цвета - это шесть цветов, созданных из смеси одного основного и одного вторичного цветов. Они применимы только к цветам, которые находятся рядом друг с другом в цветовом круге.

    Цветовое колесо / Палитра цветов

    Все первичные, вторичные и третичные цвета завершают цветовое колесо.

    Обратите внимание на визуализацию цветового круга ниже, как цвета разделены на секции слева.Эти нюансы составляют бесконечную гамму возможных цветов.

    Справа - снимок экрана палитры цветов на панели инструментов Visme. Вы видите сходство и различие между ними?

    Давайте подробнее рассмотрим, как настроено цветовое колесо и как оно преобразуется в палитру цветов на панели инструментов Visme.

    Нюансы цвета

    Обратите внимание на цветовые круги ниже. На первый взгляд мы замечаем первичный, вторичный и третичный цвета.Затем мы замечаем, что центр колеса слева белый, а справа черный.

    Это потому, что цветовое колесо слева визуализирует цветовые оттенки, а колесо справа - цветовые оттенки. Давайте посмотрим, чем они отличаются и почему они важны для психологии цвета в маркетинге.

    Чистый цвет / оттенок

    У обоих этих цветовых кругов общие цвета - это чистые цвета.

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

    Чистые цвета / оттенки могут изменяться в зависимости от значения и насыщенности.

    оттенков

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

    оттенков

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

    тонов

    Еще одна возможная настройка цвета - добавление серого (смесь черного и белого) к любому чистому цвету. Это позволяет создавать миллионы разных цветов.

    Тона редко используются в большинстве цифровых палитр цветов, за исключением профессиональных программ, таких как программы дизайна Adobe.

    Насыщенность

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

    Чистый цвет всегда с нормальной насыщенностью. Он может быть ненасыщенным белым, серым или черным, чтобы сделать его более тусклым.

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

    Использование насыщенности цвета на разных уровнях - вот что такое сочетание цветов. Например, некоторые насыщенности синего хорошо смотрятся с чистым желтым, а другие могут визуально противоречить.

    Почему эти нюансы важны в визуальном маркетинге?

    Цветовые нюансы присутствуют в цветовой палитре каждого бренда.Именно эти нюансы придают вашей цветовой палитре определенное ощущение или эмоцию.

    В маркетинге это важно, потому что правильная цветовая схема может помочь рассказать вашу историю положительно, а неправильная - отвлечь от нее.

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

    Хорошим примером использования насыщенных цветов для отправки сообщения является целевая страница с инфографикой для одного из продуктов Atlassian, Confluence.

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

    В инфографике ниже дизайнеры Atlassian использовали наиболее насыщенные цвета во вторичной палитре.

    Инфрография от Atlassian

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

    Почему? Конечно, чтобы привлечь ваше внимание!

    Как работать с цветовыми нюансами в редакторе Visme

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

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

    В редакторе

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

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

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

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

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

    Использование цветных чисел

    Цифровые цвета названы в системе HEX. Каждый цвет, тон и оттенок на цветовом круге имеет собственное шестнадцатеричное число.

    Когда вы найдете цветовую палитру, которая вам нравится, вы можете просто скопировать шестнадцатеричные числа и вставить их в палитру цветов вашего редактора.

    Шестнадцатеричный код состоит из трех частей. Первые два числа представляют красный цвет, следующие два - зеленый цвет, а последние два - синий цвет.

    Например, #FFFFFF - это число для белого, потому что это все цвета вместе (полный цвет). Шестнадцатеричное число # 000000 предназначено для черного, потому что у него вообще нет цвета.

    Вот шестнадцатеричные числа для красного, зеленого и синего:

    • Красный = # FF0000
    • Зеленый = # 00FF00
    • Синий = # 0000FF

    Гармония цветов

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

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

    Вот все типы цветовых гармоний:

    • теплый
    • Холодный
    • Дополнительная
    • Аналог
    • Монохромный
    • Триадический
    • Раздельно-комплементарная
    • Тетрадик
    • Квадрат

    Теплые и холодные цвета

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

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

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

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

    Комната, в которой преобладают теплые тона, будет более уютной, привлекательной и комфортной. Это также сделает комнату меньше, чем она есть на самом деле.

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

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

    Сделай это Pop

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

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

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

    Дополнительные цвета

    Дополнительные цвета прямо противоположны друг другу в цветовом круге.

    Вот еще несколько примеров дополнительных цветов:

    • Красный и зеленый
    • Синий и оранжевый
    • Желто-фиолетовый

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

    Общее практическое правило - использовать около 80% одного цвета и 20% другого. Если баланс 50/50, визуальный шок будет слишком сильным, и ваша графика будет трудно рассмотреть.

    Дополнительные цвета - это обычно один теплый цвет и один холодный цвет. Хорошо сбалансированная цветовая гармония с дополнительными цветами может быть привлекательной и интересной для просмотра.

    Аналогичные цвета

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

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

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

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

    Монохромные цвета

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

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

    Триадические цвета

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

    Триадная цветовая схема включает либо два теплых цвета и один холодный, либо два холодных цвета и один теплый.

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

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

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

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

    Раздельный дополнительный

    Еще одна цветовая схема с тремя цветами - это разделенная дополнительная цветовая гармония. Это похоже на сочетание дополнительных цветов, но цвета не совсем противоположны друг другу.

    В этой гармонии есть один цвет с одной стороны и два цвета прямо поперек него с каждой стороны дополнительного.

    Если один цвет красный, два других будут желто-зеленым и сине-зеленым.Если один цвет сине-фиолетовый, два других будут желтым и оранжевым.

    Разделенные дополнительные цветовые схемы обычно очень приятны. Когда вы следуете правилу 80/20 с доминирующим цветом, конечный результат может быть великолепно выглядящей графикой.

    Для большей глубины добавьте более светлый вариант одного из двух акцентных цветов.

    Тетрадик Цвет

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

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

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

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

    Будьте осторожны - просто перебор одного цвета или другого, и настроение изображения может измениться в целом.

    Квадратные цвета

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

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

    Очень важно следовать правилу 80/20 в отношении доминирующих и акцентных цветов. Обе эти цветовые гармонии также хорошо работают в градиентном дизайне.

    Создание сбалансированной цветовой схемы

    Помните, что для каждой цветовой схемы всегда должно быть немного черного и белого, чтобы сбалансировать ее.

    Например, текст на вашем веб-сайте должен быть черным или темно-серым, а фон должен быть белым или очень светлого тона.

    Это сочетание темного текста на светлом фоне неспроста является отраслевым стандартом. Он создает хороший контраст, что делает ваш контент визуально привлекательным и легким для чтения.

    Узнайте больше о том, как цвет может повлиять на конверсию веб-сайтов.

    Значения цвета и символика

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

    Когда мы говорим о психологии цвета в маркетинге, конкретное название цвета так же важно, как и его визуальные характеристики.

    Например, когда мы говорим «желтый», большинство людей будет думать о желтом солнце или желтке яичного желтка. Но если мы включим его и скажем «ярко-желтый», мы можем подумать о детской игрушке или желтом маркере.

    С «неоново-желтым» мы, вероятно, представим маркеры и светящиеся палочки, в то время как «желтуха» заставляет нас мгновенно визуализировать желтоватого, болезненного человека.

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

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

    Каждый цвет имеет положительные и отрицательные коннотации, в зависимости от конкретного тона, оттенка или оттенка, который вы используете.

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

    Давайте более подробно рассмотрим каждый цвет в отдельности:

    Желтый

    Желтый - это цвет свежих подсолнухов и резиновых уток, и вообще один из «счастливых» цветов в цветовой психологии.

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

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

    Известные примеры желтого брендинга включают арки McDonald’s и прямоугольник National Geographic. Оба они манящие и приятные.

    Тональность желтого, используемого в вашей визуальной графике, действительно важна. В отличие от того, как один и тот же оттенок красного может символизировать как силу, так и опасность, оттенки желтого обычно зависят от яркости оттенка.

    Красный

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

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

    Красные схемы брендинга имеют тенденцию быть бодрящими, яркими и знаковыми. Возьмем, к примеру, логотипы YouTube, Target и Coca-Cola.

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

    Иногда один и тот же тон может излучать как положительные, так и отрицательные цветовые значения. Например, ярко-красный цвет может символизировать как силу, так и опасность.

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

    С другой стороны, если вы используете красный цвет как символ «опасности», убедитесь, что используете универсально узнаваемые знаки, такие как красный символ «НЕ».

    Добавление белого или желтого к красному цвету может сделать его мягким и веселым. Точно так же добавление черного к красному может сделать его угрюмым и глубоким.

    Синий

    Синий цвет несет в себе широкий спектр эмоций.

    Голубое небо символизирует свежесть и воздушность, глубокий и темно-синий символизирует лидерство и знания, а более легкий синий ассоциируется с младенцами и детскими игрушками.

    Синий был важным цветом на протяжении всей истории и в изобразительном искусстве.На большинстве религиозных картин одеяния Марии синие.

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

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

    оранжевый

    Игривый и яркий оранжевый цвет вдохновляет на движение и радость.

    Оранжевый - сочетание красного и желтого - одновременно манящее и креативное. Это тот цвет, который действительно выделяется и может быть объединяющим фактором во многих различных цветовых схемах.

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

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

    зеленый

    Зеленый - цвет природы; трава, деревья и все растения между ними. Он излучает чувство равновесия, гармонии и бодрости.

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

    Это психология цвета в маркетинге на пике - общее восприятие цвета, подобного зеленому, почти создает универсальное правило того, когда его использовать.

    фиолетовый

    Фиолетовый или пурпурный издавна считался царственным цветом. Он исторически богат миром религии и власти.

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

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

    Женские товары и веб-сайты иногда используют светлый оттенок фиолетового для фона и акцентов.

    розовый

    Нет цвета лучше розового.

    Он универсален, позитивен и радует людей.

    Цвет сахарной ваты и маленьких девочек в балетных пачках. Это цвет жевательной резинки и современной прически.

    Розовый цвет часто используется в товарах, предназначенных для молодых женщин.

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

    Все зависит от вашей аудитории - столярный инструмент розового цвета будет сложно продать, но для спортивной одежды он подойдет!

    Белый

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

    Белый является неотъемлемой частью большинства цветовых схем - он может работать как дополнение, акцент или фон. Фактически, изображение без белого цвета - чистое или смешанное - может шокировать и подавлять.

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

    Эти тонкие белые цвета чрезвычайно универсальны в визуальном маркетинге. Они помогают создать «белое пространство», которое не обязательно белое. Они также отлично работают в качестве текста на более темном фоне, но при этом не будут полностью белыми.

    Черный

    Черный цвет элегантен и утончен.

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

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

    Коричневый

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

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

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

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

    Если это переработанная бумага, она должна выглядеть чистой, а не грязной.

    Металлик - золото, серебро, бронза

    Металлик - это цветовая гамма, напоминающая золото, серебро и бронзу.

    Технически это цветные пигменты с добавлением металлического порошка.

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

    Использование металлических цветов в визуальных эффектах сильно отличается на экране и в печати.

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

    Если вам интересно узнать больше об истории цветовой символики, я предлагаю вам прочитать книгу Эллен Конрой «Символизм цвета». Он был написан в 1921 году, но до сих пор актуален и полон богатых знаний о цветах.

    Значения цвета в поведенческой психологии

    По мере того, как люди растут и взаимодействуют со своим окружением, они начинают создавать индивидуальное восприятие каждого цвета.

    Например, человек, выросший в счастливой семье в доме с синей дверью, всегда будет ассоциировать этот синий цвет со счастьем и удовлетворением.

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

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

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

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

    Принципы дизайна для использования цвета

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

    Принципы гештальта

    Гештальт-принципы - это список правил дизайна, которые помогают визуализировать, как различные элементы взаимодействуют друг с другом в композиции.

    Эти принципы применимы не только к цвету, но и практически ко всему, что вы можете включить в визуальную графику. Принципы гештальт-дизайна:

    • Простота: люди визуально интерпретируют сложные изображения в их простейшей возможной форме.
    • Сходство: похожие объекты будут казаться сгруппированными или похожими на принадлежность друг другу.
    • Близость: объекты, расположенные близко друг к другу, будут казаться связанными друг с другом.
    • Замыкание: Мозги склонны восполнять недостающую информацию и игнорировать пробелы.
    • Фигура и фон: Мозг склонен воспринимать объекты как находящиеся на переднем или заднем плане.
    • Непрерывность: люди воспринимают линии как непрерывное движение.
    • Порядок и симметрия: симметричные и сбалансированные объекты кажутся цельными и завершенными.
    • Синхронность: мозг воспринимает элементы, которые выглядят так, как будто они движутся в одном направлении, как связанные друг с другом.

    Дальтонизм в визуальном дизайне

    Около 8% мужчин и 0,5% женщин в мире страдают дальтонизмом.

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

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

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

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

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

    Вам также следует проектировать кнопки CTA с учетом дальтоников.

    Большинство кнопок CTA имеют эффект наведения. Если этот эффект действительно тонкий, дальтоник может его вообще не заметить. Попробуйте использовать совершенно другой тон или оттенок цвета и добавить границу к наведению.

    Источник изображения

    Культура и гендер в психологии цвета

    Ранее мы упоминали, что розовый цвет представляет разные вещи в США и Японии.То же самое касается почти всех цветов в разных культурах.

    Маркетологи должны учитывать эти различия при создании визуальных элементов, чтобы убедиться, что они оказывают желаемое влияние на свою аудиторию.

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

    Точно так же, как культура, пол также имеет большое влияние на значения цвета.

    Мужчины и женщины часто предпочитают разные цвета и сочетания.Некоторые цвета связаны с женщинами, а другие - с мужчинами.

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

    Дополнительные ресурсы по психологии цвета в маркетинге

    Цветовые ассоциации носят как личный, так и культурный характер. Существует множество исследований о том, как люди воспринимают и ассоциируют цвет.

    Одно исследование Фабер Биррен, «Психология цвета и цветотерапия», посвящено тому, как люди связывают разные чувства и мысли с цветами.Это стоит прочитать, если вам действительно интересно, как цвет влияет на человеческие эмоции и выбор.

    Кроме того, если вы ищете действительно углубленный курс о том, как общаться о цвете со своими коллегами и клиентами, у Team W есть отличный ресурс о терминологии цвета для профессионалов UX.

    В Центре визуального обучения Visme есть еще одна статья о восприятии цвета и его влиянии на нашу индивидуальную реальность.

    Создание красивой маркетинговой графики в Visme

    Знаете ли вы, что Visme позволяет создавать привлекательную инфографику, изображения в социальных сетях и многое другое за считанные минуты?

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

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

    Нажмите здесь, чтобы зарегистрироваться и начать бесплатно!

    Вы нашли эту статью полезной? Мы хотели бы знать! Не стесняйтесь делиться своими вопросами и отзывами в разделе комментариев.

    Таблица цветов краски Behr желтый

    Behr's Calm Air - теплый естественный оттенок, который может усилить этот эффект; Кроме того, он создает красивый переход от открытого пространства к интерьеру, - говорит Эрика Вельфель, эксперт по цвету и дизайну в Behr.На фотографии: окраска стен, дверей, отделки и потолка в один теплый нейтральный цвет, например, «Calm Air» от Behr, создает ощущение простора. Jiang ziya netflix

    Таблица цветов краски - Краска Behr. Behr.com {{«Цвета, которые вы видите на Behr.com, могут не совпадать с цветами, которые вы в конечном итоге рисуете на своей поверхности». | translate}} {{'Чтобы получить истинное представление цвета, всегда начинайте свой проект с использования образца цвета Behr, чтобы подтвердить цвет в вашем доме.' | translate}} * {{'Однослойная шкура гарантирована при тонировке в MARQUEE' | перевести}} ® {{'краска...

    Орбитальная гибридизация xef4

    Полная палитра безопасных веб-цветов в основных цветах для набора. Таблица с названиями, кодами RGB, HEX и HSL основных цветов для WEB дизайна. Проверьте правильность ваших стилей CSS!

    Панель объявлений дебютной темы Shopify

    Здравствуйте! Прежде всего, большое спасибо за эту потрясающую библиотеку диаграмм: она очень полная и настраиваемая + API кажется очень ясным.У меня только один вопрос по шаблону цветов.

    В мировоззрении, что является элементом природы знания о викторине

    17 июня 2020 г. · Когда вы не можете решить, в какой цвет покрасить входную дверь, эксперт по цвету и стилист Сара Маклин из Dunn-Edwards Paints рекомендует искать мотивацию в небе. «Используйте природу как вдохновение для вашего следующего цвета входной двери», - говорит она. "Река Мира - это расслабляющий синий цвет, который радушно встречает посетителей."

    Углеродное волокно Combat troodon

    Если вы используете краску для крафта, это может быть особенно сложно сказать, поскольку в большинстве красков используются забавные названия цветов, такие как« красный флаг »или« красивый в розовом », и т. д. Ниже приведена краткая диаграмма, которую вы можете использовать для сравнения Liquitex BASICS с: DecoArt Americana Tubes, Apple Barrel Craft Paint 18 Piece Set & Artists Loft.

    Кентукки арестовывает фотографии 2020

    4 марта, 2016 - Исследуйте Big Boy Ind.доска "Paint Charts Behr", за которой следят 897 человек в Pinterest. Ознакомьтесь с другими идеями о таблицах красок, behr, цветах для дома.

    Набор для 10 модификаций оружейного шкафа

    Цвета, схемы и образцы красок SW. Выбирая цвета краски для наружных работ для вашего дома, имейте в виду, что некоторые цвета Sherwin Williams доступны только в качестве внутренних красок. Это важно знать при планировании и согласовании цветовой гаммы вашего дома.

    Коды ошибок Rds

    New Vintage Paint Colors. Вот краткий обзор наших последних винтажных красок. Дайте мне неделю, чтобы они были в сети, и примерно столько времени, чтобы завершить некоторые проекты. Спасибо, ребята, за такое терпение. Есть предложения по цвету? Отправьте их сюда ... наш цветовой круг никогда не бывает окончательным. Мой самый любимый зеленый цвет - это винтажное стекло.

    Проводной контроллер xbox one

    Benjaminmoore.com Нам нравятся яркие желтые краски, такие как Banana Yellow 2022-40 и Yellow Highlighter 2021-40, за жизнерадостность и очарование, которые они источают без особых усилий. Тонкий эффект бледно-желтой стены Хотя более смелые желтые цвета отлично подходят для акцентных цветов, мы рекомендуем более приглушенные, приглушенные желтые цвета при окрашивании более чем одной стены в комнате.

    Реализация Python для кластеризации с одной связью

    23 марта 2013 г. · Как Behr Paint Color Chart упрощает выбор.Многие из нас стояли перед списком цветов и были сбиты с толку. Как правило, лучшее решение - это взять с собой домой всего несколько цветовых таблиц. Таким образом, у вас будет свобода выбора подходящей цветовой гаммы для вашего дома.

    Таблица специй mali

    Цветовые схемы. Цвета краски. Примеры HTML / CSS. Графики составов. Цветовые пространства. Шестнадцатеричный код цвета # f8f7ed представляет собой очень светлый оттенок желтого. В цветовой модели RGB # f8f7ed состоит из 97.25% красного, 96,86% зеленого и 92,94% синего.

    Bombardier br100 specs

    1Battleship Grey House Paint Вдохновляйтесь изображениями желтых стен гостиной, декораций и аксессуаров. Посмотрите, какие желтые цвета гостиной будут лучше всего смотреться в вашем доме, и подберите идеальную краску. Лестничная теорема См. Полный список на thespruce.com VIN не дает нам вашего цветового кода. Это только дает нам какие-либо отклонения формулы краски в существующем цветовом коде. Если вы не можете найти свой цветовой код, указанный выше, заполните форму запроса цвета.Также могут быть дополнительные цвета, особенно интерьер, отделка и колеса, не показанные выше. Большинство заказов обрабатываются и отправляются в течение пяти рабочих дней. Ttp223 отрегулируйте чувствительность
    Cisco 3560 scp
    • 50 Behr Interior Paint Colors - Приятно помогать моему личному веб-сайту, в этот раз я собираюсь объяснить вам, что такое внутренние цвета краски behr. И с этого момента это может быть рисунок : Сброс топливного насоса Crown vic
    • Эта цветовая комбинация достаточно универсальна для использования в различных дизайнерских проектах, от тех, которые имеют изысканный и высококлассный вид, до тех, которые имеют спокойный и темно-розовый и темно-ненасыщенный фиолетовый цвет, сочетающиеся здесь с мягкий красный и мягкий оранжевый, чтобы создать яркую и красочную палитру, которая может быть...Ar ниже зарегистрирован как другие
    • 4 февраля 2017 г. · Желтый - мой любимый цвет, и он появился так давно, как я себя помню. Когда я был подростком, и мои родители переехали в большой старый фермерский дом, у нас был выбор покрасить наши спальни в любые цвета, которые мы хотели. Я выбрал два моих любимых… ярко-желтый и оранжевый, как солнце. Эти два цвета всегда вызывают у меня улыбку. Прерыватель воздушного потока dag
    • Цветовые схемы. Цвета краски. Примеры HTML / CSS. Графики составов. Цветовые пространства. Шестнадцатеричный код цвета # f8f7ed представляет собой очень светлый оттенок желтого.В цветовой модели RGB # f8f7ed состоит из 97,25% красного, 96,86% зеленого и 92,94% синего.Dababy lyrics blind
    • 29 июля 2020 г. · Другие галереи Behr Green Paint:. Нам нравится этот яркий цвет стен. Любезно предоставлено Dragonfly. 17 самых красивых нейтральных цветов Краски Behr на Антигуа - яркий оттенок бирюзового цвета, который Behr Color of the Year: In The Moment Palette of the Month: Apricot Spritzer Soft и Brown Behr Дом: Color Combo Палитра цветовых трендов, которая должна быть на вашем чат-боте по безработице в Нью-Джерси
    • Свежий слой краски правильного цвета может не только увеличить ваши шансы найти покупателя.