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

В этом гайде мы разберем три столпа работы с цветом: пропорции, инструменты и психологию ниши.

Золотое правило баланса: 60–30–10

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

Формула:

• 60% — Основной цвет (Base). Это «холст». Чаще всего нейтральные оттенки: белый, светло-серый, бежевый или, наоборот, глубокий темный (для Dark Mode). Им заливаем фон.
• 30% — Вторичный цвет (Secondary). Это цвет бренда. Им мы выделяем заголовки, плашки, меню, иконки, футер. Он задает настроение.
• 10% — Акцентный цвет (Accent). Самый яркий и "вкусный". Используем только для целевых действий (CTA): кнопки «Купить», ссылки, уведомления, важные бейджи.

Если кажется, что 3 цветов мало, разбавляй их оттенками. Светло-синий и темно-синий — это всё еще те же "30%", но дизайн становится глубже.

Как подобрать идеальный акцент

Как найти тот самый цвет для кнопки, чтобы она «горела», но не выжигала глаза?

Способ 1: Комплементарная схема (Противоположности)

Открываем цветовой круг Иттена. Берем ваш основной цвет (например, синий) и смотрим, что находится ровно напротив него. Это оранжевый. Эти цвета максимально усиливают друг друга.

• Зеленый ↔ Красный