Color Contrast Checker
Graphics · v1.0.0 · runs fully in the browser, data never leaves your device
Sample large heading
This is a sample body paragraph, so you can see how it actually reads. Body text has stricter requirements — smaller size and thinner strokes depend more on sufficient luminance contrast.
Contrast 4.54 : 1
Foreground luminance 0.1812 · background luminance 1.0000
WCAG 2.1 verdict
"Large text" means ≥24px regular, or ≥18.66px bold.
Color vision deficiency simulation
Passing contrast only means the luminance difference is large enough — two colors can still be hard to tell apart for color-blind users. Below is an approximation of what these three groups see.
Uses linear approximation matrices; good for quick screening, not equivalent to a medical simulation.
Contrast is pure math (relative luminance + ratio), so the result is exact. But it only reflects luminance — it does not cover color-blind users' ability to distinguish hues. Never convey information by color alone.