OpenTools

Конвертация кодов цвета — HEX, RGB, HSL, CMYK, проверка контрастности

Используется, чтобы перенести цвета из макета дизайна в код CSS или проверить читаемость текста на кнопках по критериям доступности.

Файл не отправляется на сервер — обработка выполняется только в браузере этого устройства

Проверка контрастности (WCAG)

Это коэффициент контрастности этого цвета с фоном при использовании в качестве цвета текста. Для обычного текста: AA — 4,5:1, AAA — 7:1; для крупного текста (от 24px или от 18,7px жирным) — AA 3:1, AAA 4,5:1.

Абв Aa 123
Белый фон6.29:1
✓ AA, обычный текст ✗ AAA, обычный текст ✓ AA, крупный текст ✓ AAA, крупный текст
Абв Aa 123
Чёрный фон3.34:1
✗ AA, обычный текст ✗ AAA, обычный текст ✓ AA, крупный текст ✗ AAA, крупный текст
Абв Aa 123
Выбранный цвет #FFFFFF6.29:1
✓ AA, обычный текст ✗ AAA, обычный текст ✓ AA, крупный текст ✓ AAA, крупный текст

Уровни яркости и затемнения

Нажмите на ячейку, чтобы скопировать код HEX.

Реклама

Как использовать «Конвертация цвета»

  1. 1Введите код цвета или выберите его в палитре (подходят #4f46e5, rgb(), hsl()).
  2. 2Выводится код во всех форматах — нажмите, чтобы скопировать.
  3. 3Проверяет коэффициент контрастности с белым, чёрным и выбранным цветом, соответствие стандартам WCAG, а также уровни осветления и затемнения.

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

Какой минимальный коэффициент контрастности нужен?

WCAG AA требует коэффициент не менее 4,5:1 для обычного текста и 3:1 для крупного; AAA — не менее 7:1 и 4,5:1 соответственно.

Значения CMYK отличаются от тех, что дала типография.

Значения CMYK здесь получены простым математическим пересчётом. Реальная печать зависит от профиля бумаги и чернил — уточняйте требования в типографии.

Реклама