Fix color-contrast axe errors
Text does not have enough contrast against its background for many low-vision users to read it comfortably.
Кого затрагивает
Low-vision users, users with colour-vision deficiencies, and people reading in glare or at high zoom.
Связь с WCAG
1.4.3 Contrast (Minimum) (AA)
Обнаружение
wcagc runs axe-core in the rendered browser page and reports text whose computed foreground and background colours fail the applicable WCAG AA threshold.
Почему возникает эта ошибка
- Muted design tokens are reused for body text instead of secondary decoration.
- A component changes background colour without updating its foreground token.
- Text is rendered over an image or translucent overlay whose effective colour varies.
Проблемная разметка
<p style="color:#aaa;background:#fff">Order confirmed</p>Исправленный код
<p style="color:#595959;background:#fff">Order confirmed</p>Проверьте исправление вручную
Measure the final computed colours in every state, including hover, focus, disabled and validation states. Zoom the page and review text placed over images, gradients or transparency.
Границы автоматизации
Automated contrast calculation can be inconclusive when the background is an image, gradient, pseudo-element or partially transparent layer. Those cases still need visual measurement and review.
Источники и стандарты
Метаданные правила и ссылка Deque генерируются из axe-core 4.12.1. Ссылка W3C ведёт на нормативное руководство WCAG для соответствующего критерия.
Вопросы разработчиков
Does this rule cover every contrast problem?
No. It covers many text contrast failures, but images of text, gradients, transparency and some dynamic states still need manual review.
Which ratio should I target?
WCAG 2.1 AA requires at least 4.5:1 for normal text and 3:1 for large text. Non-text controls and meaningful graphics have a separate 3:1 requirement.
Одно нарушение редко встречается в одиночку
Запустите проверку страницы в wcagc, чтобы найти это правило, связанные проблемы WCAG, затронутые селекторы и пункты, требующие ручной оценки.
Проверить страницу