Для чего используют цветовые модели
Давайте проведем эксперимент. Попробуйте определить, какой из двух цветов ниже — тот самый голубой, который указан в брендбуке Aviasales:
На первый взгляд может показаться, что они одинаковые, но на самом деле между этими образцами есть небольшая разница, которую сложно уловить человеческому глазу. Но для компьютеров найти различие между ними несложно. Самый простой способ определить оттенок цвета — использовать инструмент «Пипетка» в Photoshop:
Читайте также:
Как убрать фон с картинки в Photoshop?
Чтобы дизайнерам было проще работать, компании составляют брендбук и указывают там конкретные коды цветов, которые можно использовать при создании креативов — сайтов, контента для соцсетей, мерча или баннеров:
Гайдлайн Aviasales
Есть несколько разных систем, которые используются для обозначения цветов. Например:
Давайте подробнее разберемся, чем они отличаются между собой и в каких случаях используются.
RGB — для цифровых экранов
Название модели RGB складывается из первых букв трех цветов:
- Red (красный)
- Green (зеленый)
- Blue (голубой)
Эта модель используется для обозначения цветов на экранах разных устройств — ноутбуков, телефонов, цифровых панелей. Дело в том, что именно красные, зеленые и синие светодиоды присутствуют во всех современных экранах, и их сочетания образуют все оттенки.
Светодиоды на экране Retina. Источник
Чтобы понять, как устроена схема RGB, нужно вспомнить правила смешения цветов. Например, если смешать синий и красный, то получится фиолетовый. Но конкретный оттенок будет зависеть от того, в какой пропорции мы возьмем исходные цвета. Если добавить больше красного — цвет получится с бордовым оттенком, а если взять больше синего — получившийся фиолетовый будет иметь синий оттенок:
Фиолетовый с уклоном в синий
Фиолетовый с уклоном в бордовый
В модели RGB каждый из трех цветов тоже добавляется в большей или меньшей степени — по шкале от 0 до 255. Один светодиод на экране горит ярче, а другой тусклее, и таким образом «замешиваются» цвета на дисплее.
Выяснить, как именно сочетаются эти три цвета в конкретном оттенке можно с помощью «Пипетки» в Photoshop. В окне «Палитра цветов» будут отображаться параметры цвета в системе RGB:
Например, в этом фиолетовом оттенке присутствует максимальное значение синего (B = 255), дальше по степени выраженности идет красный (R = 167) и последним идет зеленый (G = 143). Вместе эти значения складываются в уникальный код цвета:
Если мы оставим те же самые значения для красного (R) и зеленого (G), но изменим значение синего (B) на 130, то получим другой оттенок. Теперь синий цвет ушел на задний план, а максимальные значения приобрели красный и зеленый. При их смешении как раз получается коричневый:
Hex-коды
Примерно по такому же принципу устроены коды Hex. Они начинаются с символа #, а дальше идет шесть знаков, которые можно разбить на три пары. Каждая пара обозначает степень проявления одного из цветов — красного, зеленого и синего цвета:
В таком коде полное отсутствие цвета обозначается символами 00, а максимальное символами FF. Поэтому, например, код чистого красного будет — #FF0000:
И, конечно, существует еще 16,7 миллионов промежуточных комбинаций, которые позволяют присвоить Hex-код каждому существующему оттенку.
графический дизайнер с нуля до про
профессия| 20 месяцев
графический дизайнер с нуля до про
Станьте дизайнером, который нужен в маркетинге, PR, IT. Дадим не только знания, но и реальный опыт в профессии
научиться
CMYK — для печати
CMYK — это цветовая модель, которая используется в полиграфии, поэтому ее название складывается из четырех оттенков типографских красок:
- Cyan (сине-зеленый)
- Magenta (пурпурный)
- Yellow (желтый)
- Key («ключевой» цвет, то есть черный)
Основные цвета CMYK
Принцип работы CMYK похож на модель RGB: значение каждого компонента в системе варьируется от 0 до 100%, и их сочетания образуют необходимые для печати цвета. Разница заключается в самих компонентах. Во-первых, в CMYK на один оттенок больше, во-вторых, сами цвета другие.
Цветовой профиль CMYK тоже есть в Photoshop. Дизайнерам, которые работают с печатной продукцией важно видеть, как выглядят света именно в типографской раскладке, потому что цвета в моделях RGB и CMYK в одном и том же макете будут отличаться:
В типографии каждый цвет из набора CMYK наносится на печатный лист маленькими точками, которые можно рассмотреть под микроскопом, и их наложение друг на друга создает визуальный эффект смешения красок:
Наложение цветов при печати. Источник
Pantone — для креатива
Pantone LLC — это большая компания, которой принадлежит институт цвета Pantone и цветовая модель Pantone Matching System. В нее входят как цифровые, так и физические цвета. Их используют в брендинге, веб-дизайне, полиграфии, дизайне интерьеров и промышленном дизайне.
Сейчас в основную палитру Pantone входит 3026 цветов:
- 2161 обычный цвет;
- 301 классический металлик;
- 354 премиальных металликов;
- 154 пастелей;
- 56 флуоресцентных цветов.
В Pantone Matching System собственная нумерация и особый способ представления образцов — в виде плашек, которые стали визитной карточкой бренда. Каждому цвету присваивается порядковый номер и название:
Читайте также:
Главные цвета года по версии института Pantone с 2000 по 2024 год
Некоторые названия из палитры становятся довольно известными не только среди дизайнеров, так как ежегодно Pantone объявляет «цвет года». В 2021 году это были два цвета серый 17-5104 Ultimate Gray и яркий желтый 13-0647 Illuminating:
Источник
В 2022 цветом года стал 17-3938 Very Peri:
Источник
Эти цвета называются «плашечными» или «смесевыми». Они замешиваются заранее и печатаются уже в готовом виде. Закупать смесевые цвета можно только у официальных поставщиков Pantone.
Чтобы типографии могли воспроизводить цвета из Pantone, компания разработала отдельную систему Pantone CMYK, которая позволяет воспроизводить оригинальные цвета из четырех составляющих — Cyan, Magenta, Yellow, Key.
Для графических дизайнеров цветовая палитра Pantone стала наиболее актуальной, когда компания объединилась с Adobe. Совместно они разработали сервис Pantone Connect, в который входят все библиотеки, необходимые для дизайна, с 15 000 цветов.
Палитры можно использовать в самих программах Adobe®, в браузере, на iPhone или Android. Сервис гарантирует соответствие цветов в макете и на реальных объектах, например, при печати плаката или покраске стен.
профессия графический дизайнер с нуля до про
профессия графический дизайнер с нуля до про
Маркетинг, PR, IT — мы не знаем, какую сферу вы выберете, когда станете графическим дизайнером. Но знаем, что вы сможете им стать, получив реальный опыт. Тот, который оценят работодатели
Научиться