Designer
All toolsContrast Checker
Check WCAG contrast ratios for foreground and background colors.
Colors
Sample text
Result
Contrast ratio: 16.38:1 WCAG AA normal text: Pass WCAG AA large text: Pass WCAG AAA normal text: Pass
Frequently asked questions
- What contrast ratio do I need to pass WCAG?
- WCAG AA requires 4.5:1 for normal body text and 3:1 for large text (18pt+ or 14pt+ bold). AAA tightens these to 7:1 and 4.5:1 respectively.
- Does WCAG contrast apply to icons and UI controls?
- Yes, WCAG 2.1 added a 3:1 minimum for non-text elements like form input borders, focus indicators, and meaningful icons. Decorative graphics are exempt.
- Why does light gray text on white fail contrast even when it looks fine?
- Eyes adapt to designs you've stared at for hours, but users with low vision, screen glare, or aging displays don't have that context. The 4.5:1 threshold targets readability for roughly 20/40 vision, which most people will eventually have.