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

Всички инструменти
Проверка на контраст на цветове
Проверете 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 конфигурация, JSON или SVG мостри — финалната стъпка за всяка палитра.
Популярни търсения
проверка на цветови контраст wcag съотношение на контраст проверка на контраст за достъпност проверка на контраст на текст тест за контраст aa aaa проверка на цветови контраст онлайн

Добавете този безплатен инструмент към собствения си уебсайт — копирайте и поставете кода по-долу.