Конвертер цветов
Конвертируйте цвета между форматами RGB, HEX и HSL. Бесплатный конвертер цветов с предпросмотром и копированием одним кликом для дизайнеров и разработчиков.
HEX
#3B82F6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
Значения RGB
59
Красный
130
Зелёный
246
Синий
Значения HSL
217град
Оттенок
91%
Насыщ
60%
Светл
🔒 Быстрые бесплатные калькуляторы в браузере. Без загрузки файлов, 100% конфиденциальность.
Последнее обновление: январь 2026 г.
Похожие калькуляторы
Часто задаваемые вопросы
Как конвертировать HEX в RGB?
HEX-цвет вроде #FF5733 конвертируется в RGB разбиением на пары: FF=255 (красный), 57=87 (зелёный), 33=51 (синий). Каждая пара — шестнадцатеричное число (0-FF), представляющее 0-255 в десятичной системе. Итак, #FF5733 = RGB(255, 87, 51). Для сокращённого HEX типа #F53 разверните каждую цифру: #FF5533. Этот конвертер выполняет расчёт автоматически — просто введите любой формат и получите мгновенный результат.
В чём разница между RGB и HSL?
RGB (Красный, Зелёный, Синий) определяет цвета смешиванием интенсивности света (по 0-255). HSL (Оттенок, Насыщенность, Светлота) более интуитивен: Оттенок — позиция на цветовом круге (0-360°), Насыщенность — интенсивность цвета (0-100%), Светлота — яркость (0-100%). HSL проще для корректировок — чтобы осветлить цвет, просто увеличьте L. Для обесцвечивания уменьшите S.
Когда использовать HEX или RGB в CSS?
Используйте HEX (#FF5733) для статических цветов — он компактен и универсально поддерживается. Используйте RGB или RGBA когда нужна прозрачность: rgba(255, 87, 51, 0.5) создаёт 50% прозрачный цвет. HSL отлично подходит для программного управления цветом — корректировка светлоты или насыщенности проста. Современный CSS поддерживает все три формата одинаково, выбирайте по читаемости и необходимости альфа-канала.
Как найти комплементарный цвет?
Комплементарные цвета находятся на противоположных сторонах цветового круга, создавая максимальный контраст. В HSL просто добавьте или вычтите 180° от оттенка. Например, если ваш цвет H=30° (оранжевый), комплемент — H=210° (синий). S и L оставьте без изменений. Красный (#FF0000, H=0°) дополняет голубой (H=180°). Этот конвертер показывает значения HSL, упрощая расчёт комплементов, триад (+120°) или раздвоенных комплементов (+150°/+210°).
Почему цвета выглядят по-разному на разных экранах?
Экраны различаются по цветовому охвату (диапазону отображаемых цветов), калибровке и технологии матрицы (IPS, OLED, TN). Цвет вроде #FF5733 — точное цифровое значение, но мониторы интерпретируют его по-разному в зависимости от цветового профиля и настроек. Для согласованности цвета используйте аппаратно откалиброванные мониторы, работайте в цветовом пространстве sRGB и тестируйте на разных устройствах. Печатные цвета используют CMYK с меньшим охватом чем RGB.