Бесплатный инструмент

Конвертер цветов и палитры

Конвертируйте цвета между HEX, RGB и HSL мгновенно. Генерируйте гармоничные палитры для дизайна — бесплатно и без регистрации.

#6D28D9
100%
R
G
B
H (263°)
S (69%)
L (50%)
--color: #6D28D9;
--color: rgb(109, 40, 217);
--color: hsl(263, 69%, 50%);

Что такое цветовые модели

Цветовая модель — это математический способ описания цвета с помощью числовых значений. Разные модели подходят для разных задач: веб-дизайна, печати, программирования.

Три основные модели для экранов — HEX, RGB и HSL. Каждая описывает один и тот же цвет, но по-разному, что даёт гибкость при работе с цветом.

Разница между HEX, RGB и HSL

HEX

Шестнадцатеричный формат (#RRGGBB). Компактный, используется в CSS, HTML, дизайн-системах. Легко копировать и вставлять.

RGB

Красный, Зелёный, Синий (0-255). Основа цифрового цвета. Используется в CSS (rgb()), JavaScript, обработке изображений.

HSL

Тон, Насыщенность, Светлота. Интуитивно понятный формат — легко подобрать оттенок, сделать светлее или темнее, изменить насыщенность.

Где используются цветовые модели

Веб-разработкаCSS стили, Tailwind CSS классы, CSS переменные для тем оформления
ДизайнFigma, Sketch, Adobe XD — все поддерживают HEX и RGB для точной передачи цвета
ПрограммированиеCanvas API, SVG, генерация изображений, анимации и визуализации данных
МаркетингБрендбуки, фирменные цвета, печатные материалы — точное соответствие цвета

Советы по работе с цветом

Используйте HSL для подбора

HSL позволяет легко менять оттенок, оставляя яркость и насыщенность — идеально для подбора гармоничных цветов

HEX для кода

HEX — самый компактный формат для CSS и HTML, его проще копировать и читать в исходном коде

Проверяйте контраст

При выборе цвета фона и текста убедитесь, что контраст соответствует WCAG 2.0 для читаемости

Больше AI-инструментов на AI-Mall

Конвертер цветов — один из бесплатных инструментов нашей платформы. Зарегистрируйтесь, чтобы получить доступ к AI-генерации текста, изображений, видео и аудио.

Зарегистрироваться бесплатно