Colorage

Визуализация цветовой палитры

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

Интерфейс

Экраны, где цвет должен вести к действию, а не заливать кадр.

Открыть раздел

Бренд

Бумага, афиша и упаковка — разная площадь одного знака.

Открыть раздел

Типографика

Набор, где оттенок только отмечает строку, а не красит её целиком.

Открыть раздел

Паттерн

Повтор, в котором важнее доля цвета, чем его имя.

Открыть раздел

Иллюстрация

Графика, где цвет держит площадь, даль или мелкий силуэт.

Открыть раздел

Как устроена визуализация палитры

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

Карта разделов

Полоска HEX называет состав, но не говорит, какой цвет станет действием, а какой останется бумагой. Визуализация для этого делится на пять адресов. Интерфейс смотрит на кнопки и статусы. Бренд — на знак и носитель. Типографика — на чтение. Паттерн — на повтор. Иллюстрация — на глубину и силуэт.

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

  1. Выберите раздел. Фильтр открывает страницу интерфейса, бренда, типографики, паттерна или иллюстрации.
  2. Откройте карточку. Превью ведёт на адрес конкретного макета. Там же меняется палитра и тема.
  3. Сохраните ссылку. После правки цветов адрес макета можно отправить. Страница без набора HEX остаётся канонической для поиска.
  • Интерфейс — экраны и действие
  • Бренд — знак и площадь носителя
  • Типографика — цвет рядом с кеглем
  • Паттерн — ритм без сюжета
  • Иллюстрация — планы и мелкий знак

Чем карта отличается от генератора

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

Все примеры

Цвет лендинга

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

Цвета дашборда

Какой цвет оставить действию, если на экране сразу много цифр.

Цвет визитки

Что остаётся на кромке карты, когда имя должно читаться сразу.

Цвет постера

Как собрать афишу одним полем, не раскрашивая каждую фигуру.

Цвет упаковки

Как крышка, корпус и этикетка делят одну систему на трёх предметах.

Цвет в статье

Где цвету место в развороте, если колонка должна остаться спокойной.

Цвет цитаты

Что выдерживает одна фраза, когда поле уже занято цветом.

Цвет плитки

Как увидеть долю цвета, когда клетки лежат рядом без подписи.

Цвет полос

Какая ширина несёт роль, а какая только считает повтор.

Цвет точек

Что задаёт ритм на поле кругов: диаметр или соседний тон.

Цвет форм

Как плоскости показывают вес цвета, когда сюжета нет.

Цвет пейзажа

Какой слой уходит вдаль, а какой остаётся сигналом вблизи.

Цвет иконок

Что остаётся от палитры, когда знак уменьшают до кнопки.

Часто задаваемые вопросы

Что показывает страница визуализации?

Карту из пяти разделов и карточки всех макетов. Разбор конкретного экрана, носителя или раппорта открывается на его собственной странице.

Почему макеты не разобраны прямо здесь?

У обзора, раздела и примера разные задачи. Общая страница только направляет. Законы лендинга, визитки или иконок написаны там, где виден сам макет.

Как поделиться палитрой с макета?

Откройте пример и поменяйте цвета. В адресе появится палитра, ссылку можно отправить коллеге или открыть в генераторе.