Design
WCAG Color Contrast Ratio
A rule that measures if text colors are dark or bright enough to read easily against their background.
Detailed Explanation
The Web Content Accessibility Guidelines (WCAG) specify minimum contrast ratios to ensure that text is readable for individuals with moderate low vision or color vision deficiencies. Under WCAG 2.1 Level AA, standard body text requires a minimum contrast ratio of 4.5:1, and large text requires 3:1. Level AAA requires 7:1 for normal text and 4.5:1 for large text. You can test this using the Contrast Checker.
Key Technical Takeaways
- Level AA requires 4.5:1 contrast for normal text and 3:1 for large text (18pt+ or 14pt bold).
- Level AAA requires 7:1 contrast for normal text and 4.5:1 for large text.
- Calculated based on relative luminance rather than raw color values.
- Essential for inclusive digital product design and legal accessibility compliance.
Interactive Companion Tool
Try the Contrast Checker
Run calculations and transformations instantly in your browser with zero latency.