color contrast checker

Check WCAG 2.1 contrast ratios for any two colors. See AA and AAA pass/fail for normal and large text. Runs entirely in your browser — zero tracking, zero ads.

WCAG 2.1 AA & AAA hex · rgb · hsl browser-only
foreground (text)
background
Normal text — 16px / 1em. The quick brown fox jumps over the lazy dog.
Large text — 24px bold. WCAG Success Criterion 1.4.3
UI text / placeholder / caption — small size.
contrast ratio
AA · normal text
≥ 4.5:1 required
AA · large text
≥ 3:1 required
AAA · normal text
≥ 7:1 required
AAA · large text
≥ 4.5:1 required
test combinations

WCAG contrast reference

What is WCAG AA?

WCAG 2.1 AA requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt+ bold). AA is the baseline accessibility standard required by most laws and audits including WCAG-A11y, Section 508, and EN 301 549.

What is WCAG AAA?

AAA is the enhanced level: 7:1 for normal text, 4.5:1 for large text. Recommended for critical interfaces such as healthcare, emergency services, or content aimed at users with severe visual impairments. AAA is not required for conformance but is best practice.

How is contrast ratio calculated?

Contrast = (L1 + 0.05) / (L2 + 0.05) where L1 is the relative luminance of the lighter color and L2 of the darker. Luminance is computed from sRGB channels: linearise each (gamma-decode), then sum 0.2126R + 0.7152G + 0.0722B. This weights channels to human eye sensitivity (green-heavy).

related tools
color → hex · rgb · hsl converter passgen → password generator chmod → permission calculator uuid → v4 / v7 generator
colorcontrast vs WebAIM Contrast Checker — full comparison →
browse all 66 free tools →