Палитра и оттенки цвета
Бесплатно · без регистрацииГенерируйте оттенки светлее и темнее и гармонии (комплементарная, аналоговые, триада) из любого базового цвета.
Не удалось распознать цвет.
Работает прямо в браузере — данные не покидают ваше устройство и нигде не сохраняются. Без регистрации.
Сгенерируйте палитру из любого базового цвета — оттенки светлее (tints) и темнее (shades), плюс комплементарная, аналоговые и триадная гармонии. Клик по свотчу копирует hex. Чистая HSL-математика в браузере; ничего не загружается. Рядом с нашим конвертером цветов — под запросы «color palette generator», «color shades», «tints and shades». Бесплатно, без регистрации.
- ✓Светлее и темнее ступенями
- ✓Комплементарная, аналоговые и триадная гармонии
- ✓Hex на каждом свотче — клик копирует
- ✓Принимает hex, rgb, hsl и CSS-имена
- ✓Пипетка и текстовый ввод
- ✓Локальная HSL-математика — без зависимостей
Кому подходит
- Стартовые палитры UI-тем
- Шкалы оттенков бренда
- Быстрый разбор гармоний
- Копирование hex в токены дизайна
Как это работает
- 1Введите или выберите базовый цвет.
- 2Просмотрите ряды оттенков и гармоний.
- 3Кликните свотч, чтобы скопировать hex.
- 4Вставьте в CSS, Figma или токены дизайна.
Частые вопросы
Чем tint отличается от shade?+
Tint смешивает цвет к белому (выше lightness); shade — к чёрному (ниже lightness). Оттенок (hue) и насыщенность в этом инструменте сохраняются.
Как считается комплементарная?+
Комплементарная — hue на 180° напротив на HSL-круге; аналоговые — ±30°; триада — 0° / 120° / 240°.
Чем отличается от конвертера цветов?+
Конвертер показывает HEX/RGB/HSL одного цвета. Эта страница строит палитру родственных цветов для дизайн-систем и UI-тем.
Это пары с доступным контрастом?+
Нет — здесь родственные оттенки и ступени яркости. Контраст текста на фоне проверяйте отдельно.
Цвет куда-то уходит?+
Нет. Все преобразования в браузере.
Вам может пригодиться
Некоторые ссылки — партнёрские, подробнее
Похожие инструменты
Форматирование, проверка и минификация JSON в браузере.
Кодирование и декодирование Base64, с поддержкой UTF-8.
Декодируйте заголовок и payload JWT в браузере.
Проверяйте регулярные выражения с подсветкой совпадений.
Кодирование и декодирование URL и query-строк.
Генерация случайных UUID v4, в том числе списком.