Генератор цветовых палитр
- Файлы не покидают устройство
- Работает в браузере
- Бесплатно, без регистрации и водяных знаков
3b82f6
e24956
3ba01b
Как пользоваться: Генератор цветовых палитр
Создавайте цветовые палитры тремя способами: правила гармонии от базового цвета, случайные палитры, которые можно закрепить и перебросить, или шкала из 11 ступеней от 50 до 950 как у Tailwind. Цвета считаются в OKLCH, и каждая палитра экспортируется в CSS, Tailwind v3 или v4, JSON, .gpl или .ase.
- 1
Выберите режим: гармония, случайно или оттенки.
- 2
Для гармонии или оттенков задайте базовый цвет, затем выберите правило либо имя цвета и ступень «Оставить базу на».
- 3
Для случайного режима нажмите «Сгенерировать» или пробел и закрепите цвета, которые хотите сохранить, перед следующей генерацией.
- 4
Наведите на цвет и нажмите значок копирования; в гармонии его также можно сделать новым базовым цветом.
- 5
В «Экспорте» выберите HEX, CSS, Tailwind v3, Tailwind v4 или JSON и скопируйте код либо скачайте .gpl или .ase.
Частые вопросы
Почему гармонии считаются в OKLCH?
Оттенки поворачиваются в OKLCH, поэтому каждый цвет сохраняет воспринимаемую светлоту и насыщенность базового. Поворот в HSL сделал бы жёлтые заметно светлее синих.
Как строятся оттенки от 50 до 950?
Светлота следует кривой, близкой к собственным палитрам Tailwind, а хроматичность достигает пика около 500–600. Базовый цвет сохраняется точно на своей ступени; «Авто» выбирает ступень, ближайшую к его светлоте.
Можно ли вернуться к более ранней случайной палитре?
Да. Используйте «Предыдущая палитра» и «Следующая палитра»; последние 50 палитр хранятся, пока страница открыта, но после закрытия ничего не сохраняется.
Сколько цветов может быть в палитре?
Случайные палитры содержат от 2 до 10 цветов (кнопки − и +). Правила гармонии дают фиксированное число, например 2 для комплементарной и 5 для аналоговой или монохромной, а оттенки всегда дают 11.
Как выглядит экспорт Tailwind v4?
Блок @theme с переменными --color-*, готовый к вставке в CSS. Оттенки записываются как значения oklch() с именами вроде --color-brand-500; остальные режимы используют HEX.