Check WCAG AA and AAA color contrast ratios for web accessibility compliance. Required under the European Accessibility Act and ADA.
Quick Presets
Normal text (16px) — The quick brown fox jumps over the lazy dog.
Large text (24px) — Heading
Bold 14px text — Button or label text
Contrast Ratio
10.55:1
| Standard | Normal Text | Large Text |
|---|---|---|
| WCAG AA (4.5:1 / 3:1) | Pass | Pass |
| WCAG AAA (7:1 / 4.5:1) | Pass | Pass |
🇪🇺 European Accessibility Act (EAA) 2025
European websites are now legally required to meet WCAG 2.1 AA standards under the European Accessibility Act, which came into full effect in June 2025. This includes a minimum color contrast ratio of 4.5:1 for normal text. Non-compliance can result in enforcement actions in EU member states. Use this tool to verify your color choices comply.
WCAG AA requires a minimum contrast ratio of 4.5:1 for normal text (under 18px or under 14px bold) and 3:1 for large text (18px and above, or 14px bold and above). These thresholds ensure that text is readable for users with moderate visual impairments, including color vision deficiencies.
WCAG AA is the standard compliance level required by most accessibility laws, including the European Accessibility Act and ADA. It requires a contrast ratio of 4.5:1 for normal text. WCAG AAA is a stricter standard requiring 7:1 for normal text and 4.5:1 for large text. AAA is recommended but not legally required in most jurisdictions.
Yes. The European Accessibility Act (EAA), which came into full effect in June 2025, requires websites and digital products serving EU customers to meet WCAG 2.1 Level AA standards. This includes the minimum contrast ratio of 4.5:1 for text content. Non-compliance can result in enforcement actions and fines in EU member states.
A contrast ratio of at least 4.5:1 is the minimum for accessibility compliance. However, a ratio of 7:1 or higher provides the best readability for all users, including those with low vision or reading in bright sunlight. Pure black text on white has a ratio of 21:1, which is the maximum possible.
You can use your browser's DevTools — in Chrome, inspect any text element and look at the color property, which shows a contrast ratio. Alternatively, copy the HEX codes for your text and background colors and paste them into this checker for instant WCAG compliance results.
Advertisement