Эта палитра цветов начинается с визуального образца и держит точные числовые значения рядом. Можно вставить CSS hex-значение вроде #3366cc, подвинуть каналы красного, зелёного, синего и альфа или точно настроить оттенок, насыщенность и светлоту для дизайн-системы. Цветовые значения никуда не загружаются - преобразования выполняются локально на JavaScript.
Бесплатная палитра цветов
Работает прямо в браузере - без загрузки файлов и регистрации.
Выбрано#3366cc
HSL220, 60%, 50%
HEX
#3366ccHEX8
#3366ccffRGB
rgb(51, 102, 204)HSL
hsl(220, 60%, 50%)HSV
hsv(220, 75%, 80%)CMYK
cmyk(75%, 50%, 0%, 20%)Что такое палитра цветов?
Палитра цветов - это инструмент для выбора точного цифрового цвета и копирования его значений для дизайна или кода. Используйте образец, поле HEX, ползунки RGB или настройки HSL, а затем сразу копируйте значения HEX, RGB, HSL, HSV или CMYK. Всё работает в браузере.
Как пользоваться
- 1Выберите или вставьте цвет. Кликните по большому образцу, чтобы открыть палитру цветов браузера, или вставьте 3-, 4-, 6- или 8-значное hex-значение в поле HEX.
- 2Настройте каналы. Используйте ползунки RGB для красного, зелёного, синего и альфа, или редактируйте оттенок, насыщенность и светлоту, когда нужен более удобный для дизайна контроль.
- 3Скопируйте нужный формат. Копируйте HEX, HEX8, RGB, HSL, HSV или CMYK одним кликом. Предпросмотр и все выходные значения обновляются сразу.
Кому пригодится
- Фронтенд-разработчики, которые копируют готовые для CSS значения HEX, RGB и HSL при создании интерфейсов.
- Дизайнеры, которые настраивают фирменный цвет по каналам, а не подбирают его на глаз в графическом редакторе.
- Маркетинговые команды, которые выравнивают цвета кампаний в email-редакторах, документах и материалах для соцсетей.
- Студенты и авторы, которые разбираются, как RGB, HSL, HSV и CMYK описывают один и тот же цвет.
Вопросы и ответы
Эта палитра цветов бесплатная?
Да. Палитра цветов бесплатная, без регистрации и без лимита использования. Откройте страницу, выберите цвет и скопируйте нужный формат.
Мои цвета куда-то загружаются?
Нет. Палитра и преобразования работают в вашем браузере на обычном JavaScript. Выбранные цвета не отправляются на сервер.
Какие цветовые форматы можно скопировать?
Можно скопировать HEX, 8-значный HEX с альфа, RGB или RGBA, HSL или HSLA, HSV и CMYK. Инструмент синхронизирует их во время редактирования.
Можно вставить hex-цвет?
Да. Вставьте 3-, 4-, 6- или 8-значные CSS hex-значения, с символом # или без него. Сокращённые значения разворачиваются по обычным правилам CSS.
Что такое HEX8?
HEX8 - это 8-значный hex-цвет, где последняя пара хранит альфа-канал. Например, #3366cc80 - тот же синий с прозрачностью около 50%.
Что лучше использовать в CSS - RGB или HSL?
Используйте RGB, когда нужны точные значения каналов или альфа через rgba(). Используйте HSL, когда нужно создавать светлые варианты, тени или связанные состояния интерфейса через изменение насыщенности и светлоты.