Как подобрать палитру для бренда: полное руководство по работе с цветом

Зачем бренду нужна цветовая палитра

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

• является частью визуального кода: помогает подчеркнуть индивидуальность бренда, вызвать нужные эмоции и ассоциации; 
• влияет на восприятие: каждый цвет несет свое «сообщение». Например, синий — доверие и стабильность, его часто используют банки и IT-компании. Зеленый ассоциируется с природной свежестью или деньгами; 
• делает бренд легко узнаваемым: согласно исследованию Университета Лойолы в Мэриленде, использование фирменного цвета повышает узнаваемость бренда на 80%. 

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

Как бренды выбирают цвета

Есть несколько подходов к выбору цвета. Можно опираться: 

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

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

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

Какие бывают палитры

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

• один основной;
• два‑три вспомогательных;
• один‑два акцентных;
• один-два нейтральных фоновых.

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

• Монохромная: в основе нее лежат один цвет и его оттенки с разной насыщенностью. Такая палитра выглядит эстетично и минималистично, но иногда слишком «плоско».

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

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

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

У каждого типа палитры есть свои плюсы и минусы. Например, с монохромом легко работать, но он может выглядеть скучно. Аналогичная палитра не всегда достаточно выразительна. Комплементарные и триадные сочетания выглядят эффектно, но с ними трудно работать. Главное при выборе палитры — ориентироваться на сам бренд и его характер.

Как составить палитру бренда по шагам

Рассмотрим, как создать палитру бренда с нуля.

Шаг 1. Определите характер бренда 

Первое, что нужно сделать, — понять, какой образ вы хотите транслировать. Представьте, что бренд — это человек. Какой он: сдержанный или веселый? Дерзкий или заботливый?

Например, помогающему бренду подойдет мягкая, теплая палитра, а решительному и прогрессивному — контрастная и холодная.

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

У каждого бренда есть главный цвет, с которым его ассоциируют. Например, у Starbucks — зеленый, у McDonald’s — красный и желтый, у Netflix — черный и красный. 

При выборе цвета важно учитывать:

• Как он будет выглядеть на разных носителях?
• Насколько он распространен в вашей нише?
• Как сочетается с остальными элементами?

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

Шаг 3. Добавьте вспомогательные цвета

Чтобы палитра была контрастной и гибкой, нужно добавить в нее: 

• вспомогательные оттенки — их используют на подложках, иконках, иллюстрациях, кнопках, UI-элементах; 
• акцентный цвет — тот, который будет «вспыхивать» на фоне остальных. Обычно он контрастирует с основной палитрой, но при этом хорошо с ней сочетается;

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

Шаг 4. Проверьте палитру в разных средах

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

• в цифровом интерфейсе (UI-дизайн);
• на реальных носителях (упаковка, визитки, вывески);
• в инверсии, потому что белый логотип может «провалиться» на черном фоне.

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

Инструменты для подбора палитры

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

Adobe Color

Умеет генерировать моно‑, аналогичные, комплементарные, триадные и тетрадные палитры. Еще у сервиса есть интеграция с Creative Cloud: можно сохранить выбранную палитру и сразу открыть ее в Illustrator или Photoshop. 

Coolors

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

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

Paletton

Хорошо подходит для создания монохромной палитры с едва заметными переходами. Здесь можно задавать цвет, диапазон насыщенности и яркости. 

Еще Paletton показывает примеры того, как палитра выглядит в веб‑интерфейсе, например в качестве кнопки, шрифта или подложки. Это помогает мгновенно увидеть, не «провалился» ли текст.

Khroma

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

Ошибки при подборе палитры

При создании палитры дизайнеры часто совершают эти ошибки:

• Слишком много цветов: когда выбрано много оттенков, бренд превращается в лоскутное одеяло и не ассоциируется с конкретным цветом. Из-за этого страдает узнаваемость.
• Нарушенная контрастность: перенасыщенная палитра быстро утомляет пользователей, а слишком бледная — теряется в ленте. Важно поддерживать баланс: если основной оттенок очень яркий, лучше сочетать его с более нейтральными тонами.
• Нет иерархии: нужно не только правильно выбрать цвета, но и грамотно их использовать. У каждого элемента (текста, кнопки, иконки) своя роль, а благодаря контрасту мы понимаем, что в дизайне первостепенно. 
• Нет подготовки к печати: цифровой ультрамарин на бумаге становится грязно‑синим, а фирменный черный уходит в угольно‑коричневый. Если не делать тестовую печать и мокапы, можно испортить хороший дизайн. 

Чтобы правильно использовать палитру, ориентируйтесь на правило «60-30-10»: 

• 60% элементов — основной цвет;
• 30% — дополнительные оттенки;
• 10% — акцентный цвет.

Это поможет сделать дизайн гармоничным и привлекательным.

Примеры брендов с сильным цветовым кодом

За каждым успешным брендом стоит сильная цветовая палитра:

• Tiffany & Co. — ювелирный дом выбрал цвет яйца малиновки. В 1845 году Чарльз Тиффани использовал ярко-бирюзовый оттенок для обложки ежегодного каталога украшений Blue Book. С тех пор он ассоциируется с брендом. Компания зарегистрировала цвет юридически и может отстаивать права на него в суде.

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

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

Как документировать палитру

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

• HEX — для веб-интерфейсов;
• RGB — для экранов;
• CMYK — для печати и типографии;
• Pantone — для фирменных печатных материалов, чтобы гарантировать совпадение краски.

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

Коды можно сохранить:

• в бренд‑гайде PDF или брендбуке; 
• дизайн‑системе (Figma, Adobe XD);
• Yonote, WEEEK или Teamly (в виде памятки для маркетологов).

Материалы могут использовать не только сотрудники, но и партнеры компании при подготовке совместных проектов.

Главное о том, как создать палитру бренда

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

Обычно палитра включает несколько цветов: один основной, два‑три вспомогательных, акцентные и нейтральные тона. Важно соблюдать контраст и иерархию, чтобы готовый дизайн выглядел гармонично. Можно опираться на проверенные схемы — монохромные, аналогичные, комплементарные палитры или использовать правило «60-30-10». 

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