Color contrast guide →
The ratios and rules behind this tool.
Free tool
WCAG Color Contrast Checker
Enter a text color and a background color to get the exact contrast ratio and whether it passes WCAG 2.1 / 2.2 AA and AAA — with a live preview.
—
contrast ratio
AA · Normal—
AA · Large—
AAA · Normal—
AAA · Large—
Large text preview — 24px
Normal body text preview at 16px. The quick brown fox jumps over the lazy dog. Is this comfortable to read against the background?
How to read this
- 4.5:1 — minimum for normal text at AA (the legal target).
- 3:1 — minimum for large text (18pt/24px, or 14pt bold) at AA, and for UI components under 1.4.11.
- 7:1 / 4.5:1 — the stricter AAA thresholds for normal / large text.
New to contrast rules? Read Accessible Color Contrast, Explained.
Frequently asked questions
- What is a good WCAG contrast ratio?
- At least 4.5:1 for normal text and 3:1 for large text to meet WCAG AA, the standard required by the ADA and EAA. AAA requires 7:1 and 4.5:1 respectively.
- Is this contrast checker free?
- Yes — it runs entirely in your browser, requires no signup, and makes no network calls. Your colors never leave your device.