Text Color
Background Color
Contrast Ratio
21 : 1
Excellent — Meets AAA
AA — Normal Text Pass
AA — Large Text Pass
AAA — Normal Text Pass
AAA — Large Text Pass
WCAG 2.2 Quick Reference
Level AA — Normal text ≥ 4.5 : 1
Level AA — Large text (≥18pt / 14pt bold) ≥ 3.0 : 1
Level AAA — Normal text ≥ 7.0 : 1
Level AAA — Large text ≥ 4.5 : 1
Why does colour contrast matter?
Colour contrast is the most violated WCAG criterion on the web. According to the WebAIM Million 2024 report, 83.6% of home pages have at least one contrast error. This directly affects people with low vision, colour blindness, and users in high ambient-light environments. WCAG 2.2 requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text (Level AA). For Level AAA, the ratios rise to 7:1 and 4.5:1 respectively. Our validator calculates these ratios instantly and tells you whether your colour combinations meet each level.
- 1
Minimum AA ratio: 4.5:1 (normal text) and 3:1 (large text, ≥18pt or 14pt bold).
- 2
Minimum AAA ratio: 7:1 (normal text) and 4.5:1 (large text).
- 3
83.6% of websites fail contrast criteria (WebAIM, 2024).
- 4
Free tool — no registration, unlimited use.
Frequently asked questions
Everything you need to know
01
Spanish (RD 1112/2018) and European (EAA) regulations require WCAG Level AA, which demands a ratio of 4.5:1 for normal text and 3:1 for large text (18pt regular or 14pt bold). Meeting these ratios ensures texts are legible for people with moderate low vision.
02
WCAG 2.2 (criterion 1.4.11) requires a ratio of 3:1 for non-textual interface components: form field borders, functional icons, informative graphics, etc. Only purely decorative elements are exempt.
03
This validator allows checking combinations of two colours. For a complete analysis of your corporate palette, request an accessibility audit where we analyse all combinations in your design system.
