ColorDevbeta

Contrast Checker

Check WCAG AA and AAA contrast ratios instantly.

Loading tool...

What is Contrast Checker?

A free WCAG contrast checker for developers and designers. Test any foreground/background color pair and see pass/fail results for AA and AAA compliance across normal and large text sizes. Built to match the WCAG 2.1 relative luminance specification exactly.

Frequently asked questions

+What is a WCAG contrast ratio?

The contrast ratio is a number from 1:1 (no contrast) to 21:1 (black on white) that describes the perceptual difference between two colors. WCAG 2.1 uses relative luminance to calculate it and sets thresholds for accessibility.

+What contrast ratio is required for accessibility?

WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt+ bold). WCAG AAA is stricter: 7:1 normal, 4.5:1 large.

+Does this tool work for UI components?

Yes — for non-text UI components (buttons, icons, borders) WCAG 2.1 SC 1.4.11 requires 3:1 against adjacent colors, matching AA Large.

Related tools