Конвертер цветов CSS
HEX в RGB, HSL и arbitrary Tailwind.
Об этом инструменте
Инструмент переводит цвет HEX в RGB и HSL, а также собирает произвольный класс фона Tailwind, который можно вставить в разметку. Особенно полезно для фирменных цветов, отсутствующих в палитре по умолчанию.
Как пользоваться
Измените значение в поле HEX, и каналы вместе с записью bg-[#…] пересчитаются сразу. Затем скопируйте нужную форму записи в компонент.
Пример
Пример с небесно-голубым показывает переход от HEX к RGB, HSL и Tailwind.
Ввод
#38bdf8Вывод
HEX: #38BDF8
RGB: rgb(56, 189, 248)
HSL: hsl(199, 93%, 60%)
Tailwind arbitrary: bg-[#38bdf8]Совет
Произвольные значения — это корректный Tailwind, а округление до ближайшего оттенка палитры часто искажает фирменный цвет.
Полезно знать
Какие цветовые форматы он конвертирует?
Введите HEX из 3 или 6 цифр (или воспользуйтесь палитрой) — и получите RGB, HSL и произвольный класс Tailwind вроде bg-[#38bdf8].
Почему произвольный класс, а не ближайший цвет Tailwind?
Фирменные цвета редко совпадают со стандартной палитрой. Подгонка под ближайший молча меняет дизайн, а bg-[#hex] сохраняет точный цвет.