Check WCAG 2.1 colour contrast, preview text sizes, and auto-fix a foreground to AA or AAA
Contrast ratioExcellent
Preview
Large text (24px+)
Normal text at 16px. The quick brown fox jumps over the lazy dog.
Small text at 14px for fine print and captions.
WCAG 2.1 compliance
AANormal text 4.5:1
AALarge text 3:1
AAANormal text 7:1
AAALarge text 4.5:1
About WCAG contrast requirements
- AA normal
- 4.5:1 minimum for text smaller than 18pt (or 14pt bold)
- AA large
- 3:1 minimum for text 18pt and larger (or 14pt bold)
- AAA normal
- 7:1 minimum for enhanced accessibility
- AAA large
- 4.5:1 minimum for large text, enhanced accessibility
“Fix” keeps the foreground hue and saturation and moves only its lightness until the ratio passes. Need to explore a colour in depth? Open it in the Color Picker.