CMYK и RGB — почему на мониторе ярче, чем на бумаге? Основные сведения об изображении

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

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

Каналы RGB

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

Как можно увидеть на рисунке выше, каждый канал содержит различную информацию:

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

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

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

Каналы CMYK

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

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

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

Плашечные каналы

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

Каналы Lab

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

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

В режиме Lab присутствуют следующие каналы:

• Яркость (Lightness) . Он содержит обесцвеченные детали изображения, оно выглядит как действительно хорошая черно-белая версия. Некоторые люди клянутся, что, отделив его в новый документ, а затем проведя небольшую правку, вы сможете создать черно-белое изображение достойное Энсела Адамса .
• а . Он содержит половину цветовой информации: смесь пурпурного (понимайте как «красный») и зеленого.
• b . другая половина: смесь желтого и синего.

Многоканальный режим

Этот режим вам не понадобится, если только вы не станете подготавливать изображения для печати в типографии. Однако вы можете оказаться в этом режиме случайно. При удалении одного из цветовых каналов документа в режиме RGB, CMYK или Lab, фотошоп переведет документ в данный режим без появления предупреждения. Если это произойдет, используйте палитру История для возврата на шаг назад или нажмите сочетание клавиш Ctrl+Z, чтобы отменить совершенное действие.

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

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

• преобразует RGB в голубой, пурпурный и желтый плашечные каналы;
• преобразует CMYK в голубой, пурпурный, желтый и черный плашечные;
• преобразует Lab в альфа-каналы под именами Альфа 1, Альфа 2 и Альфа 3;
• преобразует Градации серого (Grayscale) в черный плашечный.

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

Закончив редактирование, сохраните изображение как PSD или как файл DCS 2.0, если вам нужно передать его в программу предпечатной подготовки.

Одноканальные режимы

Остальные режимы изображения не очень интересны, поскольку у них только один канал. К таким режимам относятся Битовый формат (Bitmap), Градации серого (Grayscale), Дуплекс (Duotone) и Индексированные цвета (Indexed Color).

Заметили ошибку в тексте - выделите ее и нажмите Ctrl + Enter . Спасибо!

Цветовые модели RGB и CMY (CMYK)

RGB (для дисплеев) и CMYK (для печати) являются наиболее распространенными системами представления цвета.

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

Самый распространенный вариант аддитивного смешения, предполагающего суммирование разноцветных потоков в единый результирующий поток, – модель RGB (красный, зеленый, синий).

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

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

Кроме того, в сравнении с RGB, CMYK обладает меньшим цветовым охватом. Законы физики не позволяют печатать цвета RGB. Для печати RGB- изображения следует преобразовать его аддитивные цвета в цвета CMY, т.е. перевести их в субтрактивные цвета.

Система цветопередачи RGB

RGB (англ. Red, Green, Blue – красный, зеленый, синий) – аддитивная цветовая модель (англ. Additive Primary Model), описывающая способ синтеза цвета для цветовоспроизведения. Аддитивной модель называется потому, что цвета получаются путем добавления (англ. addition ) к черному цвету. Выбор основных цветов в RGB обусловлен особенностями физиологии восприятия цвета сетчаткой человеческого глаза.

Модель RGB используется для воспроизведения спектра видимого света и представляет все то, что передает, фильтрует или ощущает световые волны (например, монитор, сканер или глаз) (рис. 7.5). Для создания различных цветов складываются разные уровни основных цветов (красного, зеленого и синего). Черный цвет – это отсутствие любого света.

Рис. 7.5.

Изображение в данной цветовой модели состоит из трех каналов. При смешении основных цветов, например, синего (В ) и красного (/?), мы получаем дополнительный пурпурный (англ. М – magenta ), при смешении зеленого (G ) и красного (R ) – дополнительный желтый (англ. Y – yellow ), при смешении зеленого (G ) и синего (В ) – дополнительный циановый (англ. С – cyan ). При смешении всех трех цветовых компонентов мы получаем белый цвет. В телевизорах и мониторах применяются три электронных пушки (светодиода, светофильтра) для красного, зеленого и синего каналов.

Числовое отображение RGB

Каждая из координат RGB представляется в виде одного байта, значения которого обозначаются целыми числами от 0 до 255 включительно, где 0 – минимальная, а 255 – максимальная интенсивность.

COLORREF – стандартный тип для представления цветов в операционной системе Win32. Используется для определения цвета в RGB-виде. Размер – 4 байта.

Определить переменную типа COLORREF можно следующим образом:

COLORREFC = RGB (r,g, b ),

где г, g и b – интенсивность (в диапазоне от 0 до 255) соответственно красной, зеленой и синей составляющих определяемого цвета С.

Следовательно, ярко-синий цвет может быть определен как (0,0,255), красный – как (255,0,0), ярко-фиолетовый – (255,0,255), черный – (0,0,0), а белый – (255,255,255).

В HTML используется #RrGgBb-запись, называемая также шестнадцатеричной: каждая координата записывается в виде двух шестнадцатеричных цифр, без пробелов (цвета HTML см. далее). Например, #RrGgBb- запись белого цвета – #FFFFFF.

Для справки

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

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

Также распространены Adobe RGB и ProPhoto RGB. Цветовое пространство ProPhoto RGB, также известное как ROMM RGB (от англ. Reference Output Medium Metric – метрика образцового выходного материала), является цветовым пространством RGB, предназначенным для обработки фотографий и ориентированным на выходной материал. Стандарт разработан компанией Kodak, он предлагает особо широкий охват, предназначенный для фотоизображений.

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

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

• Графический редактор – программа (или пакет программ), предназначенная для создания и обработки графических файлов.

Цветовая информация в Photoshop хранится в так называемых каналах. Канал – это изображение, в котором точки для каждого составного цвета цветовой модели определяют яркость (количество) этого цвета. Сразу это понять непросто. Попробуем объяснить доступнее.

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

1. Загрузите любое цветное изображение. Если загруженное изображение создано в цветовой модели CMYK, преобразуйте его в RGB.

2. Откройте палитру Каналы . Вы видите четыре пункта: RGB , Красный , Зеленый и Синий . Красный , Зеленый и Синий – это и есть каналы вашего изображения.

3. Снимите флажки в виде глаза для каналов RGB , Красный и Зеленый . У вас останется включенным только канал Синий (рис. 7.1).

Рис. 7.1. Отображен канал Синий

МУЛЬТИМЕДИЙНЫЙ КУРС

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

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

Проведем простой эксперимент.

1. Создайте новое изображение с белым фоном.

2. Выберите инструмент Карандаш . Настройте кисть таким образом, чтобы линия карандаша получилась достаточно жирной, например 50 пикселов.

3. Выберите чисто красный цвет. Для этого в диалоговом окне выбора цветов укажите значение R равным 255 , а значения G и B равными 0 . Это цвет, который состоит только из красных субпикселов. Синие и зеленые субпикселы в этом цвете совершенно не участвуют (значение их яркости равно нулю).

4. Проведите в окне созданного документа линию.

5. Откройте палитру Каналы , после чего посмотрите каждый канал в отдельности.

Теперь опишем, что вы должны увидеть.

Канал Красный . Вы видите полностью белое изображение без каких-либо линий. Белый фон изображения говорит о том, что белый цвет содержит максимальный уровень красного (255). Линию вы тоже не видите, так как нарисовали ее цветом, в котором количество красного также равно 255, то есть в этом канале интенсивность красных субпикселов максимальна на всей площади рисунка.

Каналы Зеленый и Синий . Фоны этих каналов белые, так как участие синего и зеленого цветов в белом цвете также максимально (напомним, что белый цвет получается, когда значение всех трех составляющих RGB равно 255). Проведенная вами линия в данных каналах имеет черный цвет. Когда вы выбирали цвет инструмента, вы указали нулевые значения для цветов G и B , то есть в выбранном вами цвете синий и зеленый цвета не участвуют совсем. Именно поэтому в данных каналах линия имеет черный цвет, это говорит о том, что уровень соответствующих цветов в этих каналах минимален.

Теперь отобразите одновременно Красный и Зеленый каналы. Фон изображения стал желтым, а точка красной. Это результат смешивания каналов, то есть сейчас мы наложили Красный канал на Зеленый и при этом исключили Синий канал. В результате мы сложили 255 градаций красного цвета с таким же количеством зеленого цвета и тем самым получили желтый фон. Линия осталась красной, потому что к 255 градациям красного в канале Красный добавилось 0 градаций красного из канала Зеленый , то есть ничего не добавилось.

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

Аналогичную картину мы увидим, создав изображение в цветовой модели CMYK. Только каналы CMYK, в отличие от RGB, инверсные, то есть черный и белый цвета в этих каналах поменяны местами. Белый цвет означает полное отсутствие красителя, а черный – максимальное его количество (100). Например, если мы создадим изображение с белым фоном и пурпурной линией (C = 0, M = 100, Y = 0 и K = 0), то в каналах увидим следующее.

Каналы Голубой , Желтый и Черный будут полностью белого цвета. В формировании белого фона данные цвета не участвуют (бумага и так белая сама по себе).

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

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

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

С помощью каналов очень удобно корректировать цветовую гамму изображения. Например, работая с RGB-фотографией, вы замечаете, что на отдельном ее участке преобладает красный цвет. Обычными методами (уровнями) или иной цветовой коррекцией это исправить непросто. Да и не всегда удобно. Отключаете все каналы, кроме красного, и, например, инструментом Затемнитель затеняете данный участок изображения, то есть вы затеняете только красный цвет, тем самым уменьшая уровень красного в композитном цвете. Вы даже можете не отключать при этом остальные каналы: достаточно просто выделить канал Красный . Однако с отключенными каналами проще контролировать свою работу.

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

Рис. 7.2. Так выглядит изображение в отдельных каналах CMYK

Мы не случайно используем термин «носитель», поскольку изображение можно распечатывать на ткани, пластике и различных полимерных материалах.

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

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

1. Теперь, предварительно выделив канал Альфа 1 , попробуйте взять инструмент Ластик и стереть участок изображения. В месте, где «прошелся» Ластик , будет проступать изображение с исходными цветами. Иными словами, вы создали полупрозрачный альфа-канал и сделали отдельные его участки прозрачными (рис. 7.3).

Рис. 7.3. Часть канала-маски стерта ластиком

2. Нажмите сочетание клавиш Ctrl+A , при этом все изображение будет выделено, и нажмите клавишу Delete . Содержимое альфа-канала будет удалено, а изображение предстанет в оригинальных цветах.

3. Снимите выделение, нажав сочетание клавиш Ctrl+D .

4. Выберите инструмент Кисть и определите для данного инструмента синий цвет.

5. Убедитесь, что канал Альфа 1 по-прежнему выделен.

6. Сделайте кистью несколько мазков.

Обратите внимание, что в изображении появляются штрихи, отличные от выбранного вами цвета, скорее всего красные, то есть, «рисуя» синей кистью, вы можете получить красные оттенки штрихов. Это происходит потому, что цвет кисти на самом деле не синий, а определенной градации серого. Взгляните на образец цвета в нижней части панели инструментов, чтобы убедиться в этом. Добавляя серые линии на альфа-канал, вы увеличиваете уровень яркости участков основного цвета альфа-канала (по умолчанию – красного). В результате этого цвет канала суммируется с остальными каналами.

Теперь немного о настройках альфа-канала.

Чтобы вызывать диалоговое окно настроек альфа-канала (рис. 7.4), нужно дважды щелкнуть кнопкой мыши на миниатюре этого канала на палитре Каналы .

Рис. 7.4. Диалоговое окно Параметры канала

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

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

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

Следует отметить, что вы можете создать множество альфа-каналов, настроить степень их непрозрачности и цвета, далее нанести в этих каналах какие-либо штрихи и изображения. Вы можете также копировать содержимое любого канала в альфа-канал, применять к нему различные коррекции и т. д. Все это позволяет вам очень тонко настраивать цветовые параметры изображения, создавать оригинальные рисунки и т. д. При большом желании вы даже можете превратить черно-белое изображение в цветное. Для этого нужно преобразовать черно-белое изображение в модель RGB или CMYK, создать необходимое количество альфа-каналов (по числу цветов модели), скопировать изображение в эти каналы и раскрасить отдельные фрагменты изображения так, чтобы при смешивании каналов получились нужные цвета. Это, конечно, непросто и потребует много времени, терпения и опыта, но это возможно! Действительно, из старой черно-белой фотографии можно сделать цветную. Кстати, если все цветовые каналы содержат абсолютно одинаковую информацию, значит, пропорции всех цветов в отдельных точках равны. А одинаковые пропорции цветов – это всегда серая точка (в разных градациях яркости: от белой до черной). Иными словами, если изображения во всех цветовых каналах не отличаются друг от друга, значит, картинка черно-белая.

HEX / HTML

Цвет в формате HEX - это ни что иное, как шестнадцатеричное представление RGB.

Цвета представляются в виде трёх групп шестнадцатеричных цифр, где каждая группа отвечает за свой цвет: #112233, где 11 - красный, 22 - зелёный, 33 - синий. Все значения должны быть между 00 и FF.

Во многих приложениях допускается сокращённая форма записи шестнадцатеричных цветов. Если каждая из трёх групп содержит одинаковые символы, например #112233, то их можно записать как #123.

1. h1 { color: #ff0000; } /* красный */
2. h2 { color: #00ff00; } /* зелёный */
3. h3 { color: #0000ff; } /* синий */
4. h4 { color: #00f; } /* тот же синий, сокращённая запись */

RGB

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

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

Некоторые приложения (в частности веб-браузеры) поддерживают процентную запись значений RGB (от 0% до 100%).

1. h1 { color: rgb(255, 0, 0); } /* красный */
2. h2 { color: rgb(0, 255, 0); } /* зелёный */
3. h3 { color: rgb(0, 0, 255); } /* синий */
4. h4 { color: rgb(0%, 0%, 100%); } /* тот же синий, процентная запись */

Цветовые значения RGB поддерживаются во всех основных браузерах.

RGBA

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

Значение цвета RGBA задается в виде: rgba(red, green, blue, alpha). Параметр alpha - это число в диапазоне от 0.0 (полностью прозрачный) до 1.0 (полностью непрозрачный).

1. h1 { color: rgb(0, 0, 255); } /* синий в обычном RGB */
2. h2 { color: rgba(0, 0, 255, 1); } /* тот же синий в RGBA, потому как непрозрачность: 100% */
3. h3 { color: rgba(0, 0, 255, 0.5); } /* непрозрачность: 50% */
4. h4 { color: rgba(0, 0, 255, .155); } /* непрозрачность: 15.5% */
5. h5 { color: rgba(0, 0, 255, 0); } /* полностью прозрачный */

RGBA поддерживается в IE9+, Firefox 3+, Chrome, Safari, и в Opera 10+.

HSL

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

HSL расшифровывается как Hue (цвет/оттенок), Saturation (насыщенность), Lightness/Luminance (светлота/светлость/светимость, не путать с яркостью).

Hue задаёт положение цвета на цветовом круге (от 0 до 360). Saturation является процентным значением насыщенности (от 0% до 100%). Lightness является процентным значением светлости (от 0% до 100%).

1. h1 { color: hsl(120, 100%, 50%); } /* зелёный */
2. h2 { color: hsl(120, 100%, 75%); } /* светло-зелёный */
3. h3 { color: hsl(120, 100%, 25%); } /* тёмно-зелёный */
4. h4 { color: hsl(120, 60%, 70%); } /* пастельный зеленый */

HSL поддерживается в IE9+, Firefox, Chrome, Safari, и в Opera 10+.

HSLA

По аналогии с RGB/RGBA, для HSL имеется режим HSLA с поддержкой альфа-канала для указания непрозрачности объекта.

Значение цвета HSLA задается в виде: hsla(hue, saturation, lightness, alpha). Параметр alpha - это число в диапазоне от 0.0 (полностью прозрачный) до 1.0 (полностью непрозрачный).

1. h1 { color: hsl(120, 100%, 50%); } /* зелёный в обычном HSL */
2. h2 { color: hsla(120, 100%, 50%, 1); } /* тот же зелёный в HSLA, потому как непрозрачность: 100% */
3. h3 { color: hsla(120, 100%, 50%, 0.5); } /* непрозрачность: 50% */
4. h4 { color: hsla(120, 100%, 50%, .155); } /* непрозрачность: 15.5% */
5. h5 { color: hsla(120, 100%, 50%, 0); } /* полностью прозрачный */

CMYK

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

Цвета определяются соотношением голубого (Cyan), пурпурного (Magenta), жёлтого (Yellow), с добавлением чёрного (Key/blacK).

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

Например, для получения цвета «PANTONE 7526» следует смешать 9 частей голубой краски, 83 частей пурпурной краски, 100 - жёлтой краски, и 46 - чёрной. Это можно обозначить следующим образом: (9,83,100,46). Иногда пользуются такими обозначениями: C9M83Y100K46, или (9%, 83%, 100%, 46%), или (0,09/0,83/1,0/0,46).

HSB / HSV

HSB (также известна как HSV) похожа на HSL, но это две разные цветовые модели. Они обе основаны на цилиндрической геометрии, но HSB/HSV основана на модели «hexcone», в то время как HSL основана на модели «bi-hexcone». Художники часто предпочитают использовать эту модель, принято считать что устройство HSB/HSV ближе к естественному восприятию цветов. В частности, цветовая модель HSB применяется в Adobe Photoshop.

HSB/HSV расшифровывается как Hue (цвет/оттенок), Saturation (насыщенность), Brightness/Value (яркость/значение).

Hue задаёт положение цвета на цветовом круге (от 0 до 360). Saturation является процентным значением насыщенности (от 0% до 100%). Brightness является процентным значением яркости (от 0% до 100%).

XYZ

Цветовая модель XYZ (CIE 1931 XYZ) является чисто математическим пространством. В отличие от RGB, CMYK, и других моделей, в XYZ основные компоненты являются «мнимыми», то есть вы не можете соотнести X, Y, и Z с каким-либо набором цветов для смешивания. XYZ является мастер-моделью практически всех остальных цветовых моделей, используемых в технических областях.

LAB

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