Color Contrast Checker
Enter a text color and a background color to get the WCAG contrast ratio and a clear pass or fail for each use.
Check Your Colors
Large text preview
Normal body text preview — the quick brown fox jumps over the lazy dog.
Button outlineContrast Results
5.48:1
Normal Text
Needs 4.5:1 for AA, 7:1 for AAA.
AA passAAA fail
Large Text
Needs 3:1 for AA, 4.5:1 for AAA.
AA passAAA pass
User Interface Components
Needs 3:1 for AA.
AA pass
Suggested Accessible Colors
We keep your text hue and adjust its lightness until it meets the target against your background.
About Contrast Ratios
Contrast ratio compares the relative luminance of two colors, from 1:1 (identical) to 21:1 (black on white). Because it depends on lightness, not hue, it stays meaningful for people with color vision deficiencies.