Перейти к содержимому
BrowserUtil

Конвертер цветов

Конвертация между HEX, RGB, HSL, HSV и CMYK, палитра оттенков и проверка контрастности WCAG.

#2563EB100% Прозрачность
Непрозрачность100%
Каналы RGB
R37
G99
B235
Популярные цвета

Форматы представления цвета

HEX
#2563EB
HEXA (with Alpha)
#2563EBFF
RGB
rgb(37, 99, 235)
RGBA
rgba(37, 99, 235, 1)
HSL
hsl(221, 83%, 53%)
HSLA
hsla(221, 83%, 53%, 1)
HSV / HSB
hsv(221, 84%, 92%)
CMYK (Print)
cmyk(84%, 58%, 0%, 8%)

Палитра оттенков (Tints & Shades)

Светлые оттенки (Tints)
Темные оттенки (Shades)

Коэффициент контрастности WCAG 2.1

Контраст с белым (#FFFFFF)5.17:1
Съешь же ещё этих мягких французских булок, да выпей чаю
AA (≥4.5) ✓ Pass AAA (≥7.0) ✕ Fail
Контраст с черным (#000000)4.06:1
Съешь же ещё этих мягких французских булок, да выпей чаю
AA (≥4.5) ✕ Fail AAA (≥7.0) ✕ Fail

Инструкция

  1. 1 Выберите цвет с помощью визуальной палитры или введите любое значение HEX, RGB, HSL или CSS-имя цвета.
  2. 2 Настройте прозрачность ползунком или скорректируйте отдельные каналы R, G, B.
  3. 3 Скопируйте нужный формат: HEX, RGB, HSL, HSV или полиграфический CMYK в один клик.
  4. 4 Оцените контрастность текста по стандартам доступности WCAG 2.1 и подберите гармоничные оттенки.

Возможности

  • Мгновенная взаимная конвертация HEX, HEXA, RGB, RGBA, HSL, HSLA, HSV и CMYK
  • Интерактивная палитра с предпросмотром альфа-прозрачности на шахматном фоне
  • Поддержка стандартных именованных цветов CSS (например, crimson, steelblue)
  • Проверка контрастности WCAG 2.1 со значками соответствия стандартам AA и AAA
  • Генератор 10-ступенчатой палитры светлых и темных оттенков
  • Ползунки поканальной точной настройки каналов Red, Green, Blue
  • 100% вычисления на стороне клиента без задержек

Часто задаваемые вопросы

В чем разница между RGB, HSL и HSV?

RGB задает цвет через интенсивность красного, зеленого и синего свечения экранов. Модели HSL (тон, насыщенность, светлота) и HSV (тон, насыщенность, яркость) значительно ближе к восприятию человеческого глаза и удобнее для дизайна.

Что означают рейтинги доступности WCAG AA и AAA?

Стандарты WCAG 2.1 требуют контрастности не менее 4.5:1 для обычного текста (уровень AA) и 7:1 для повышенной доступности (AAA). Для крупного шрифта достаточно 3:1 (AA).

Поддерживается ли альфа-канал прозрачности?

Да, вы можете легко регулировать прозрачность ползунком. Значения HEXA, RGBA и HSLA будут обновляться автоматически.

Похожие инструменты