Генератор цветовых палитр
Создавайте красивые гармоничные цветовые палитры мгновенно с нашим бесплатным онлайн-генератором. Поддерживает монохроматический, аналоговый, комплементарный, триадический, расщеплённо-комплементарный и тетрадический режимы. Настраивайте цвета с помощью HSL-слайдеров, блокируйте избранные и экспортируйте в CSS, Tailwind, JSON или SVG. 100% на базе браузера, ваши данные никогда не покидают устройство.
Как сгенерировать цветовую палитру?
Нажмите кнопку «Сгенерировать» или пробел для создания случайной палитры. Используйте селектор режима гармонии для выбора монохроматической, аналоговой, комплементарной, триадической, расщеплённо-комплементарной или тетрадической схемы.
Как закрепить понравившийся цвет?
Нажмите на значок замка на образце цвета. Закреплённые цвета останутся при генерации новой палитры, а незакреплённые будут заменены.
Как экспортировать палитру?
Нажмите кнопку «Экспорт», чтобы выбрать формат: CSS-переменные, конфигурация Tailwind, массив JSON или палитра SVG. Палитра будет автоматически скопирована в буфер обмена.
В чём разница между режимами гармонии?
Монохроматический — один оттенок с разной насыщенностью и светлотой. Аналоговый — смежные оттенки (±30°). Комплементарный — противоположные оттенки (180°). Триадический — 3 равноудалённых оттенка (120°). Расщеплённо-комплементарный — базовый оттенок плюс два смежных с комплементарным. Тетрадический — 4 равноудалённых оттенка (90°).
Можно построить палитру вокруг фирменного цвета?
Да. Выберите фирменный цвет в базовом пикере, затем режим гармонии — остальные четыре цвета сгенерируются вокруг него. После этого каждый можно донастроить HSL-слайдерами.
Какие форматы экспорта доступны?
Палитру можно экспортировать как CSS-переменные, конфиг Tailwind, JSON-массив или SVG-файл. При переключении формата предпросмотр кода обновляется мгновенно — можно сразу копировать в проект.
Можно ли смотреть значения в HEX, RGB или HSL?
Да, значение каждого цвета переключается между HEX, RGB и HSL. Вы берёте сразу тот формат, который нужен вашему дизайн-инструменту или коду, без ручного пересчёта.
Что означает маленький значок на каждом цвете?
Он показывает, какой текст — белый или чёрный — остаётся читаемым на этом цвете. Когда контраст достигает 4,5:1, значок отмечает «пройдено» по рекомендациям WCAG — удобно при выборе фона кнопок и баннеров.
Палитра загружается на сервер?
Нет. Всё работает локально в браузере, цвета не покидают ваше устройство. После загрузки страницы генератор работает даже офлайн.
Как использовать Генератор цветовых палитр
Создавайте гармоничные палитры в режимах Monochromatic, Analogous, Triadic и других — вычисления идут в вашем браузере. Закрепляйте удачные оттенки, доводите их до ума и экспортируйте в формате вашего фреймворка.
- Выберите режим гармонии (Mode) в выпадающем списке: Random, Monochromatic, Analogous, Complementary, Triadic, Split-complementary или Tetradic.
- Задайте цвет Base, чтобы каждая плашка выводилась из фирменного оттенка, и перегенерируйте набор, пока он не понравится.
- Нежелательные плашки удалите кнопкой ✕ и бросьте заново; оставшиеся подстройте ползунками HSL.
- Сравните плашки на светлых и тёмных макетах, чтобы убедиться, что текст читаем поверх каждого цвета.
- Откройте Export Palette и заберите цвета как CSS Variables, Tailwind Config, JSON Array или SVG Palette.
Закрепите плашку Base перед перегенерацией в режиме Random — так вы исследуете вариации вокруг фирменного цвета, не теряя его.
Похожие инструменты
- Конвертер цветов Бесплатный онлайн-конвертер цветов. Мгновенное преобразование HEX, RGB, HSL, HSV с визуальным пикером. 100% конфиденциально, работает в браузере.
- Пипетка цветов Выбирайте любой цвет с экрана с помощью пипетки. Копируйте коды HEX, RGB, HSL мгновенно. Бесплатный онлайн-инструмент.
- Проверка контрастности цветов Проверьте коэффициенты контрастности для соответствия WCAG 2.1. Мгновенная проверка стандартов AA и AAA.
- Симулятор дальтонизма Бесплатный онлайн-симулятор дальтонизма. Тестируйте дизайны для протанопии, дейтеранопии, тританопии и других типов. 100% конфиденциально, работает в браузере.
- GIF Разбор Кадров Извлеките и скачайте отдельные кадры из GIF-анимаций как PNG или спрайт-лист. Бесплатный онлайн-инструмент с просмотром и экспортом ZIP.
- GIF Реверс Измените порядок воспроизведения GIF-анимаций бесплатно онлайн. Загрузите, просмотрите и скачайте мгновенно.
- Изменитель скорости GIF Измените скорость анимации GIF онлайн. Мгновенно ускорьте или замедлите GIF-файлы.
- Видео в GIF Конвертируйте видео в анимированные GIF онлайн. Настраивайте качество, частоту кадров и разрешение прямо в браузере без загрузки файлов.