Color Contrast Checker
WCAG contrast compliance
Source Input
Processed Output
What is the Color Contrast Checker?
WCAG requires 4.5:1 contrast for normal text and 3:1 for large text (AA), or 7:1 / 4.5:1 for AAA. Enter foreground and background colors to get the exact ratio, pass/fail per level, and accessibility guidance — critical for accessible design and legal compliance.
Frequently Asked Questions (FAQ)
Q: What counts as large text?
Text at 18.66px bold or 24px regular and above. Large text has lower contrast requirements.
How to Use the Color Contrast Checker
- 1Paste your input into the editor above — or start from the preloaded example.
- 2Adjust any options, then click Run to process instantly in your browser.
- 3Review the output panel, then copy, download, or save it as a reusable snippet.