Designer

Contrast Checker

Check WCAG contrast ratios for foreground and background colors.

All tools

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.