Палитра из HEX
Из одного цвета строит палитру 50–950 (как Tailwind) и комплементарные/аналогичные/триадные схемы.
О сервисе
Из одного исходного цвета строит палитру в стиле Tailwind (50, 100, 200…950) и три цветовые схемы: комплементарная, аналогичная, триадная. Готовые CSS-переменные.
Что умеет
- 11 оттенков от 50 (светлый) до 950 (тёмный)
- Комплементарная схема (противоположный цвет)
- Аналогичная схема (±30° по hue)
- Триадная схема (3 цвета по 120°)
- Готовый CSS-блок с :root переменными
- Клик по образцу — копирование HEX
Как работает
Цвет переводится в HSL, фиксируется hue и saturation, варьируется lightness по предзаданным значениям. Для схем меняется hue.
Пример
Удобно для дизайн-систем: вводите бренд-цвет — получаете полный набор оттенков и сочетающихся цветов.
Нужен подобный сервис для вашего сайта или сложный сценарий — пишите, разработаю под задачи.
Похожие инструменты
Генератор border-radius
Конструктор скруглений углов CSS. Все углы одинаково или каждый отдельно, превью прямоугольника.
Генератор clip-path
Готовые формы clip-path: треугольник, ромб, шестиугольник, звезда, стрелка и др. Превью + готовый CSS.
Генератор CSS box-shadow
Конструктор тени для блоков с превью карточки. Слайдеры X/Y/blur/spread, цвет, режим inset, несколько теней.
Генератор CSS-анимации
Готовые @keyframes анимации: fade, bounce, shake, pulse, spin, slideIn. Слайдеры длительности, повторов и timing-функции.
Генератор CSS-градиента
Визуальный конструктор linear- и radial-градиентов. Color stops, угол наклона, готовый CSS-код.
Конвертер px → rem / em / vw
Перевод значений CSS из пикселей в rem, em, vw, vh, % и обратно. Настраиваемый root font-size, ширина и высота вьюпорта.
Сделаю такой же сервис под вашу задачу
Внутренние инструменты для сотрудников, публичные сервисы для клиентов, конвертеры и генераторы. Напишите — обсудим.
