Таблица html цветов

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

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

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

Gray Shades 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)
#696969 rgb(105,105,105)
#707070 rgb(112,112,112)
#787878 rgb(120,120,120)
HTML Gray #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)
HTML DarkGray !!! #A9A9A9 rgb(169,169,169)
#B0B0B0 rgb(176,176,176)
#B8B8B8 rgb(184,184,184)
X11 Gray #BEBEBE rgb(190,190,190)
HTML Silver #C0C0C0 rgb(192,192,192)
#C8C8C8 rgb(200,200,200)
#D0D0D0 rgb(208,208,208)
HTML LightGray #D3D3D3 rgb(211,211,211)
#D8D8D8 rgb(216,216,216)
HTML Gainsboro #DCDCDC rgb(220,220,220)
#E0E0E0 rgb(224,224,224)
#E8E8E8 rgb(232,232,232)
#F0F0F0 rgb(240,240,240)
HTML WhiteSmoke #F5F5F5 rgb(245,245,245)
#F8F8F8 rgb(248,248,248)
HTML White #FFFFFF rgb(255,255,255)

An anomaly in the table above is that HTML Gray is darker than DarkGray.

The color names of HTML / CSS was inherited from the X11 standard.

HTML / CSS defined gray at the midpoint of the 8-bit gray scale (128,128,128).

X11 defined gray to be (190,190,190); which is closer to HTML silver.

По названию

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%) Фиолетовый

Почему так много цветовых схем?

На самом деле их не так уж и много. В целом их все можно поделить на два типа: схемы представления цвета от излучаемого, и от отражённого света. Все объекты видимы для нас потому, что они сами являются источником света, либо светят отражённым светом. Чтобы более ясно понять это, взгляните на небо. Перед вами предстанут два вида объектов: те, которые светят (солнце, звезды, кометы, метеориты) и те, которые светят отражённым светом (планеты, спутники, космонавты и станция «Мир»).

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

Человеческий глаз не способен отличить цвет «определённого цвета», от цвета, полученного путём смешивания других цветов. Издавна люди подметили эту особенность, и вместо того чтобы создавать миллионы красок различных оттенков, традиционно используется лишь небольшое ограниченное их число (от сотни до трёх), а все остальные краски получаются путём смешивания исходных. Эти исходные цвета называются «первичными» — primary colors.

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

В связи с этим определяются цветовые схемы (color schemes) — набор первичных цветов, используемых для получения всех остальных цветов.

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

CMYK

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

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

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

Что­бы давать прин­те­ру ука­за­ния, где какую крас­ку нано­сить, исполь­зу­ют цве­то­вую модель CMYK.

CMYK — это ком­пью­тер­ная цве­то­вая модель, кото­рая ими­ти­ру­ет сме­ши­ва­ние кра­сок на бума­ге. Пер­вые три бук­вы — это назва­ния цве­тов, из кото­рых всё смешивается: 

Cyan — голубой 

Magenta — пурпурный 

Yellow — жёлтый

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

CMYK исполь­зу­ют для раз­ра­бот­ки поли­гра­фи­че­ской про­дук­ции, то есть для все­го, что печа­та­ет­ся на бума­ге. Модель CMYK гово­рит прин­те­ру или печат­но­му стан­ку: «Вот тут нане­си пур­пур­но­го, а там нане­си голу­бо­го, тут всё залей жёл­тым». И если прин­тер пра­виль­но всё нане­сёт, полу­чит­ся нуж­ное нам цвет­ное изображение. 

Напри­мер, если прин­те­ру пору­чат напе­ча­тать одну из наших обло­жек, он вос­при­мет эту инструк­цию так:

Вид­но, что синий цвет пены полу­ча­ет­ся от сме­ши­ва­ния попо­лам голу­бо­го и розо­во­го. Крас­ный цвет стен сме­ши­ва­ет­ся из пур­пур­но­го и жёл­то­го. А цвет кожи — это жёл­тый с неболь­шим добав­ле­ни­ем пур­пур­но­го. И отдель­но нано­сят­ся чёр­ные линии. 

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

Реше­ние при­ду­ма­ли такое: доба­вить в модель чёр­ный цвет. Так появи­лась модель CMYK: Cyan, Magenta, Yellow, Black. Чёр­ный исполь­зу­ют, что­бы печа­тать текст и допол­ни­тель­но под­кра­ши­вать чёр­ные участ­ки изображений.

Обра­ти­те вни­ма­ние, что цве­та на этой кар­тин­ке не «вырвиглаз­ные» и яркие, а при­глу­шён­ные. Это ком­пью­тер пыта­ет­ся отоб­ра­зить на экране, как эти цве­та будут выгля­деть на бумаге 

Выбрать текст цвета #fff, фон цвета #fff

Как выглядит текст цвета #fff на светлом и тёмном фонах, светлый и тёмный текст на фоне цвета #fff. Сравните выбранный цвет #fff шрифта с его размером (заголовок и обычный текст).

Текст #fff на светлом
На светлом фоне (#f9faf0) текст цвета #fff. Сравните читаемость текста выбранного цвета на тёмном фоне.

Текст #fff на тёмном
На тёмном фоне (#00181f) текст цвета #fff. Тёмная тема приятна для глаз ближе к ночи.

Фон #fff с белым текстом
На фоне #fff текст белого цвета (#ffffff) при достаточном контрасте приятно выделяется.

Фон #fff с чёрным текстом
Текст чёрного цвета привычнее смотреть на белом, светлых тонах. На фоне #fff текст чёрного цвета (#000000).

Как подключаются эти разновидности

Подключить ленту можно своими руками, сложностей в работе нет. Главное – разобраться в процессе и следовать схеме, чтобы ничего не перепутать и не сжечь оборудование. Предварительно нужно приобрести все, что нужно – саму ленту, блок питания (подобрать под напряжение ленты, чаще всего используется вариант на 12 В, реже на 24). Также для работы нужен контроллер, а если длина 5 м или больше, то ставится усилитель сигнала. Следовать инструкции:

  1. RGB-ленту подключать проще всего, так как на ней всего 4 контакта. Вначале отрезать по указанной линии, после подключить коннектор или припаять контакты, что нежелательно. От ленты завести провода на котроллер так, как показано на схеме ниже, а его присоединить к блоку питания. Стоит проверить работу, чтобы убедиться, что все нормально.
  2. RGBW присоединяется почти так же с той разницей, что есть дополнительный контакт. Контроллер подойдет и универсальный, в нем можно подключать разные типы лент.
  3. RGBWW подключается шестиконтактным коннектором и для него не стоит использовать универсальный контроллер, лучше купить специально предназначенную модель. Она дороже, но эффект будет намного лучше.

Стандартная схема подключения для RGB-ленты.

Схема для RGBW-варианта с дополнительным контактом.

Выбрать светодиодную ленту несложно, если знать основные особенности каждой марки

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

RGBA цвета

RGBA является более современным методом задания цвета, где:

  • R означает Red (красный)
  • G означает Green (зеленый)
  • B означает Blue (синий)
  • A означает Alpha (степень смешивания с фоном)

Этот метод отличается от RGB тем, что он добавляет альфа-канал, который позволяет задать уровень прозрачности со значениями от до 1, где:

  • — цвет невидимый.
  • 1 — цвет непрозрачный.
<p style = color: rgba(255, 0, 0, 0.1)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.1 --> 
<p style = color: rgba(255, 0, 0, 0.2)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.2 --> 
<p style = color: rgba(255, 0, 0, 0.3)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.3 --> 
<p style = color: rgba(255, 0, 0, 0.4)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.4 --> 
<p style = color: rgba(255, 0, 0, 0.5)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.5 --> 
<p style = color: rgba(255, 0, 0, 0.6)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.6 --> 
<p style = color: rgba(255, 0, 0, 0.7)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.7 --> 
<p style = color: rgba(255, 0, 0, 0.8)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.8 --> 
<p style = color: rgba(255, 0, 0, 0.9)">Я абзац красного цвета?</p> <!-- значение альфа канала 0.9 --> 

Несовершенство цветовых моделей

Модели Lab, HSB, RGB и CMYK — основные, с которыми сталкиваются дизайнеры, иллюстраторы и фотографы. Они упрощают работу, но реальная цветопередача не так предсказуема. Например, RGB и CMYK, с которыми работают чаще всего, — это аппаратно-зависимые модели.

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

Знать механику цветовых моделей важно любым специалистам, работающим с компьютерной графикой: веб-дизайнерам, художникам в 2D и 3D, геймдизайнерам и даже фотографам. Но особенно внимательная работа с цветами необходима при дизайне полиграфии: ведь по изображению на мониторе нужно понять, какой получится картинка, напечатанная красками на бумаге

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

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

Цветовая модель RGB — то, что мы видим на экране

Это модель для отображения цвета в цифровых устройствах — например, на мониторах или в цифровых камерах. В ней каждый цвет кодируется значениями базовых цветов: Red (красный), Green (зелёный) и Blue (голубой). Это три оси, которые имеют градацию значений от 0 до 255. Нулевая точка этой системы координат — чёрный, а максимальные значения по всем трём осям кодируют белый цвет.

Например, посмотрим, как получается ярко-красный в системе RGB. Для этого нужно высокое значение по шкале R и низкие значения по двум другим.

В левом верхнем углу наш цвет с координатами (247; 6; 6)

Наглядно модель RGB можно представить как раскрашенный кубик:

В двух углах расположены чёрные и белые точки

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

Вопросы и задачи по теме

Перед тем как перейти к изучению следующей темы пройдите практическое задание:

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

Практическое задание № 11.

Нюанс: для выполнения задания вы можете задавать цвет любым методом, но задание считается выполненным если хотя бы один раз было использовано шестнадцатеричное значение, значение RGB, значение HSL и предопределённый цвет.

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

Стили

Таблицы

Цветовое пространство HSB

Эта модель разработана для первых графических редакторов еще в 90-х годах. Ее отличием является трехканальное построение спектра. Она определяет не просто какой-то оттенок смешением красок, данный тип цветопередачи основан на показателях цвета, а именно:

  1. Hue – цветовой тон. Выбирается один из спектра радуги, имеет радиальное расположение, определяется углом от 0 до 360 градусов на окружности с оттенками. С другой стороны, параметр эквивалентен длине световой волны, которую воспринимает человеческое зрение.
  2. Saturation – насыщенность. Регулирует контрастность оттенка по отношению к печатному или виртуальному носителю. Это как при подмешивании белой краски. Наиболее насыщенные цвета находятся по краям круга, чем ближе к центру, тем они становятся более бледными. Соответствует интенсивности цветовой волны.
  3. Brightness – яркость, где 0 – это полностью белый, а 100 – черный. Данный параметр задает освещенность цветовой волны.

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

Способы использования RGB

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

Для сравнения, CMYK, что означает «Cyan Magenta Yellow Key (Black)» и является производным от CMY, является отражающей цветовой моделью, означающей, что его цвета отражаются, а не освещаются, и используются в основном в печати. Вот почему при калибровке принтера вы работаете с цветовым пространством CMY, а при калибровке дисплея компьютера — с RGB.

Принтеры используют цветовую модель CMYK

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

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

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

Источники RGB пикселей на экране

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

Однако диапазоны трех чисел могут различаться в зависимости от того, какую систему исчисления вы используете. Стандартные нотации RGB могут использовать тройки значений от 0 до 255, некоторые могут использовать арифметические значения от 0,0 до 1,0, а некоторые могут использовать процентные значения от 0% до 100%.

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

Представление цветов RGB в 8-битной системе, каждый цвет в диапазоне от 0 до 255

Диапазон чисел от 0 до 255 выбран не случайно: RGB часто представлен в программном обеспечении 8-битами на канал. Если вам интересно, почему 255 является максимальным значением в 8-битной исчислении, так это потому, что каждый цвет в нем представлен 8 битами. Бит может иметь два значения: 0 или 1. Два бита, будут иметь четыре значения: 00, 01, 10, 11. (в двоичной системе.) Таким образом, восемь битов, дадут 256 значений — от 0 до 255. То есть, два в восьмой степени. Гики, верно?

Однако обычно используются и другие системы исчисления, такие как 16-бит на канал или 24-бит на канал. Например, в 16-битной системе, каждый бит может принимать значения от 0 до 65535, а в 24-битной системе — от 0 до 16777215. 24-битная система охватывает 16 миллионов цветов, что больше, чем все цвета, которые видны человеческому глазу, который различает 10 миллионов.

Сочетания цветов с #fff

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

Toggle
убрать описание сочетаний цветов

Дополнительные цвета #fff ?

Сочетание комплементарных цветов создаётся из основного цвета #fff и противоположного #ffffff , согласно цветового круга. Комплементарные цвета способны усиливать интенсивность друг друга.

Близкие цвета #fff ?

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

Треугольник цвета #fff ?

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

Квадратное сочетание цветов #fff ?

В квадратной гармонии четыре цвета равноудалены друг от друга

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

Раздельно-комплементарная цветовая гармония #fff ?

Разделённая цветовая схема (расщеплённый дополнительный цвет, split complementary) состоит из трёх цветов: одного основного #fff и двух дополнительных. За счёт двух почти противоположных цветов образуется гибкость и изящность гармонии, сохраняя высокую контрастность.

Монохромное сочетание #fff ?

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

Числовое представление цвета

Как уже было сказано ранее, RGB цвета формируются путем смешивания основных. Для описания интенсивности каждого из них приняли схему, в которой цвет представляется диапазоном 0-255 (8 бит), что в шестнадцатеричной системе исчисления соответствует 00-FF.

То есть, основные цвета будут иметь следующий вид:

  • Красный – RGB(255,0,0);
  • Зеленый – RGB(0,255,0);
  • Синий – RGB(0,0,255);

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

Таблицы цветов RGB

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

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

Безопасная палитра RGB цветов

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

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

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

Золотой цвет в RGB модели

Впервые слово «золотой», было использовано в начале XIV века для описания цвета химического элемента под названием Aurum – золото. В модели RGB золотой цвет представлен следующими числовыми значениями:

  • RGB (255, 215, 0) – десятеричная система;
  • HEX #FFD700 – шестнадцатеричная система.

Бежевый цвет в RGB модели

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

  • RGB (245, 245, 220) – десятеричная система;
  • HEX #F5F5DC – шестнадцатеричная система.

скучный

Выбор цвета

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

На данных иллюстрациях представлены панели выбора цвета программ Paint, Photoshop, и Fireworks:

MS Paint: стандартная панель цветов Windows.

Adobe Photoshop CC: уже лучше, но представление цветового пространства по-прежнему плоское.

Adobe Fireworks CS6: цветовой круг, свойства цвета, широкие возможности по подбору палитры цветовых сочетаний.

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

Цветовая схема CMYK

Состоит из 4 основных цветов, расшифровка CMYK:

  • С (сyan) – синий – можно охарактеризовать как насыщенный голубой;
  • M (magenta) – малиновый – цвет, приближенный к темно-розовому или фуксии;
  • Y (yellow) – желтый – ортодоксальный привычный цвет без понижения или повышения тона;
  • K (key) – черный.

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

На данный момент именно эта модель является стандартом в офсетной полноцветной печати в Европе, США, Японии. В большинстве случаев используется цветовая схема CMYK, при которой оттенки исчисляются от 0 до 100, однако есть и другая модель – CMYK 255. В ней оттенки исчисляются от 0 до 255. Приведем пример.

Допустим, требуется получить чисто черный, тогда показатели должны быть максимальными (в стандартной схеме – по 100), если же белый (то есть отсутствие цвета) – 0. Регулируя каждый из 4 показателей, можно добиться требуемого оттенка. Обычно для дизайнеров помощниками выступают специальные инструменты, как, например, пипетка в редакторе Photoshop. Она определяет не просто вид конкретного оттенка, но и его цветовую схему. Тогда для достижения идентичного результата (при множественном тираже или различных вариантах корпоративной продукции) достаточно знать цифровое значение каждого цвета в системе.

LAB

Цветовая модель LAB (CIELAB, «CIE 1976 L*a*b*») вычисляется из пространства CIE XYZ. При разработке Lab преследовалась цель создания цветового пространства, изменение цвета в котором будет более линейным с точки зрения человеческого восприятия (по сравнению с XYZ), то есть с тем, чтобы одинаковое изменение значений координат цвета в разных областях цветового пространства производило одинаковое ощущение изменения цвета.

HEX в RGB
HEX в RGBA
HEX в RGB(%)
HEX в RGBA(%)
HEX в HSL
HEX в HSLA
HEX в CMYK
HEX в HSB/HSV
HEX в XYZ
HEX в LAB
RGB в HEX
RGB в RGBA
RGB в RGB(%)
RGB в RGBA(%)
RGB в HSL
RGB в HSLA
RGB в CMYK
RGB в HSB/HSV
RGB в XYZ
RGB в LAB
RGBA в HEX
RGBA в RGB
RGBA в RGB(%)
RGBA в RGBA(%)
RGBA в HSL
RGBA в HSLA
RGBA в CMYK
RGBA в HSB/HSV
RGBA в XYZ
RGBA в LAB
RGB(%) в HEX
RGB(%) в RGB
RGB(%) в RGBA
RGB(%) в RGBA(%)
RGB(%) в HSL
RGB(%) в HSLA
RGB(%) в CMYK
RGB(%) в HSB/HSV
RGB(%) в XYZ
RGB(%) в LAB
RGBA(%) в HEX
RGBA(%) в RGB
RGBA(%) в RGBA
RGBA(%) в RGB(%)
RGBA(%) в HSL
RGBA(%) в HSLA
RGBA(%) в CMYK
RGBA(%) в HSB/HSV
RGBA(%) в XYZ
RGBA(%) в LAB
HSL в HEX
HSL в RGB
HSL в RGBA
HSL в RGB(%)
HSL в RGBA(%)
HSL в HSLA
HSL в CMYK
HSL в HSB/HSV
HSL в XYZ
HSL в LAB
HSLA в HEX
HSLA в RGB
HSLA в RGBA
HSLA в RGB(%)
HSLA в RGBA(%)
HSLA в HSL
HSLA в CMYK
HSLA в HSB/HSV
HSLA в XYZ
HSLA в LAB
CMYK в HEX
CMYK в RGB
CMYK в RGBA
CMYK в RGB(%)
CMYK в RGBA(%)
CMYK в HSL
CMYK в HSLA
CMYK в HSB/HSV
CMYK в XYZ
CMYK в LAB
HSB/HSV в HEX
HSB/HSV в RGB
HSB/HSV в RGBA
HSB/HSV в RGB(%)
HSB/HSV в RGBA(%)
HSB/HSV в HSL
HSB/HSV в HSLA
HSB/HSV в CMYK
HSB/HSV в XYZ
HSB/HSV в LAB
XYZ в HEX
XYZ в RGB
XYZ в RGBA
XYZ в RGB(%)
XYZ в RGBA(%)
XYZ в HSL
XYZ в HSLA
XYZ в CMYK
XYZ в HSB/HSV
XYZ в LAB
LAB в HEX
LAB в RGB
LAB в RGBA
LAB в RGB(%)
LAB в RGBA(%)
LAB в HSL
LAB в HSLA
LAB в CMYK
LAB в HSB/HSV
LAB в XYZ

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Adblock
detector