Работа с форматами цвета
Вставьте цвет в любом формате — HEX, rgb() или hsl() — либо выберите его пипеткой, и конвертер мгновенно покажет все три записи с предпросмотром. Дополнительно строится шкала из девяти оттенков того же тона от светлого к тёмному: удобно подбирать цвета для кнопок, ховеров и фонов в едином стиле.
HEX и RGB описывают цвет одинаково — долями красного, зелёного и синего. HSL устроен иначе: тон задаёт «какой это цвет», насыщенность — его чистоту, светлота — яркость. Поэтому в HSL легко программно осветлять и затемнять цвета, сохраняя оттенок.
Частые вопросы
Чем отличаются HEX, RGB и HSL?
Это три записи одного и того же цвета. HEX (#3b6ef6) компактен и распространён в вёрстке. RGB задаёт доли красного, зелёного и синего (0–255). HSL описывает цвет через тон, насыщенность и светлоту — в нём удобно делать оттенки светлее или темнее.
Как получить более светлый или тёмный оттенок цвета?
Проще всего в HSL: увеличьте или уменьшите последний параметр — светлоту (L). Инструмент автоматически показывает шкалу оттенков выбранного цвета, каждый можно скопировать кликом.
Обновлено: 2 июля 2026