Генератор цветовой палитры
Начните с любимого цвета или доверьтесь случаю, а затем оставьте оттенки, которые подходят.
Запечатано на этом устройстве
Работает в вашем браузере. Ничего не загружается на сервер.
Запечатано
Ваша палитра
Настройки
Палитра строится вокруг базового цвета. Закреплённые цвета сохраняются.
Экспорт
Как это работает
-
Выберите базу или случайный вариант
Введите базовый цвет и выберите гармонию или нажмите «Новая палитра» (или пробел), чтобы получить свежую.
-
Закрепите то, что нравится
Закрепите цвета, которые хотите сохранить, и сгенерируйте снова: изменятся только незакреплённые. Нажмите на образец, чтобы настроить его вручную.
-
Экспортируйте палитру
Скопируйте её как переменные CSS или JSON для кода либо скачайте PNG, чтобы поделиться с командой.
Частые вопросы
Что означают гармонии?
Они основаны на цветовом круге. Аналоговые цвета стоят рядом и выглядят спокойно. Комплементарные расположены напротив и создают контраст. Раздельно-комплементарная схема, триада и квадрат равномерно распределяют цвета по кругу для более живых палитр. Монохромная использует более светлые и тёмные варианты одного тона.
Как работает закрепление?
Нажмите на замок под цветом, чтобы сохранить его. При генерации новой палитры закреплённые цвета остаются на своих местах, а новые подбираются так, чтобы сочетаться с ними.
Почему цвета выглядят такими сбалансированными?
Палитры строятся в OKLCH — цветовом пространстве, созданном с учётом человеческого зрения. Поворот тона в нём сохраняет светлоту и насыщенность, поэтому ни один цвет не выглядит неожиданно ярким или блёклым рядом с остальными.
Как использовать палитру в проекте?
Скопируйте экспорт CSS и вставьте его в таблицу стилей: вы получите переменные вроде --color-1, которые можно использовать где угодно. Экспорт JSON содержит каждый цвет в HEX, RGB и OKLCH для дизайн-токенов или скриптов.
Можно ли использовать палитры в коммерческих целях?
Да. Цвета никому не принадлежат, а палитры, созданные здесь, вы можете свободно использовать в личных или коммерческих проектах.