Color Contrast Checker
Test whether your text and background colors meet WCAG 2.1 accessibility standards.
Contrast Ratio
—
AA Normal Text
—
AA Large Text
—
AAA Normal Text
—
AAA Large Text
—
Normal text looks like this. The quick brown fox jumps over the lazy dog.
Large text looks like this.
How it works
WCAG 2.1 defines contrast ratio as the relative luminance of the lighter color plus 0.05, divided by the relative luminance of the darker color plus 0.05. The result is a ratio from 1:1 (no contrast) to 21:1 (maximum contrast, black on white).
The thresholds:
- AA Normal Text (4.5:1) — Minimum for body text. Most accessibility laws reference this level.
- AA Large Text (3:1) — Minimum for text 18px+ bold or 24px+ regular.
- AAA Normal Text (7:1) — Enhanced contrast. The gold standard for readability.
- AAA Large Text (4.5:1) — Enhanced contrast for large text.
The luminance calculation uses the sRGB color space, converting each channel through a linearization step before weighting (0.2126 red, 0.7152 green, 0.0722 blue). This matches how human vision perceives brightness — green contributes far more than red or blue.