Проверка контрастности цветов

Все инструменты
Проверка контрастности цветов
Проверьте соотношение контрастности WCAG между цветом текста и фона — просматривайте оценки AA/AAA для обычного текста, крупного текста и элементов UI в реальном времени с предложениями доступных цветов.
Цвет текста
Тинт
Цвет фона
Тинт
Коэффициент контрастности
--:1
Обычный текст
Основной текст до 18px (или до 14px жирный)
AA AAA
Крупный текст
18px+ обычный или 14px+ жирный
AA AAA
Элементы UI
Иконки, рамки, элементы форм и графика
AA AAA
Живой предпросмотр

Быстрая коричневая лиса

Крупный текст читается комфортно при достаточной контрастности.

Это образец абзаца обычного основного текста. Хорошая контрастность цветов делает ваш контент читаемым для всех, в том числе для людей с плохим зрением или дальтонизмом. образец ссылки.

Мелкий шрифт и подписи сложнее всего читать — они требуют наибольшей контрастности.
Пример кнопки Пример кнопки
Предложение

Всё вычисляется в реальном времени в вашем браузере по формуле относительной яркости WCAG 2.x — без загрузок, без регистрации, абсолютно бесплатно.

Поделиться
Похожие инструменты
Симулятор дальтонизма

Посмотрите на своё изображение или палитру глазами людей с протанопией, дейтеранопией, тританопией или ахроматопсией — всё работает прямо в вашем браузере, ничего не загружается.
Конвертер цветовых кодов

Конвертируйте цвета между HEX, RGB, RGBA, HSL, HSLA и HSV — выберите цвет, настройте прозрачность и мгновенно скопируйте любой формат.
Экспортер палитр

Вставьте или импортируйте набор цветов и мгновенно экспортируйте их в CSS-переменные, SCSS, Tailwind config, JSON или SVG-образцы — финальный шаг для любой палитры.
Популярные запросы
проверка контрастности цветов коэффициент контраста wcag проверка контраста доступности проверка контраста текста тест контраста aa aaa проверить контраст цветов онлайн

Добавьте этот бесплатный инструмент на свой сайт — скопируйте и вставьте код ниже.