Почему пропорции цветов делают дизайн менее хаотичным

Открываю чужой макет в Figma. Вижу: синяя шапка, оранжевые кнопки, зелёные иконки, красные бейджи, фиолетовые ссылки. Глаз не знает, куда смотреть. Мозг устаёт.

Правило 60-30-10

Это правило пришло из интерьерного дизайна, но работает везде: веб, мобайл, презентации, соцсети.

Суть простая: три роли, три пропорции.

60% основной цвет. Фон. Пространство. Нейтральный тон белый, светло-серый, бежевый. Глаз отдыхает.

30% дополнительный. Чуть темнее основного. Карточки, боковые панели, разделители. Создаёт структуру.

10% акцент. Один. Единственный. Именно туда, куда должен смотреть пользователь. Кнопка «Купить». Ссылка. Иконка действия.

Разбор на примере: лендинг с одним экраном

Представь: продаёшь курс по маркетингу. Главный экран.

Три акцента:

• Заголовок синий (чтобы выделялся)
• Кнопка «Купить» оранжевая (чтобы заметили)
• Иконки зелёные (чтобы было живо)

Результат: взгляд прыгает между тремя точками. Кнопку замечают в последнюю очередь.

Разместите
тендер бесплатно

Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.

Заполнить заявку 13470 тендеров
проведено за восемь лет работы нашего сайта.

Одна роль у каждого цвета:

• Фон: #F8F7F4 тёплый белый (60%)
• Карточки и блоки: #EDECEA чуть темнее (30%)
• Кнопка «Купить»: #2D6BE4 только кнопка такого цвета (10%)

Взгляд сразу идёт к кнопке. Конверсия растёт.

А что если бренд требует нескольких цветов?

Тогда работает модификация правила: один цвет остаётся акцентом действий (CTA), остальные только декор, никогда не конкурируют с главным.

Как применить прямо сейчас

Открой любой свой макет и сделай аудит за 2 минуты:

1. Выпиши все цвета, которые использованы
2. Спроси себя: сколько из них «призывают к действию»?
3. Если больше одного, то это конкуренция. Выбери главный, остальные переведи в нейтральный.

Простой тест: закрой глаза, открой макет и первое, куда ты посмотрел, это и есть акцент. Это должна быть кнопка или главный призыв. Если нет, то правило нарушено. Лучше конечно показать дизайн кому-то ещё и спросить, куда человек посмотрел первым делом.

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