Contrast Checker
Check the contrast ratio between text and background colors and see WCAG AA / AAA results for normal and large text.
Contrast ratio
17.74: 1
Normal text 4.5:1 · PASSLarge text 3:1 · PASS
AAA Normal text 7:1 · PASSAAA Large text 4.5:1 · PASS
Preview
A clear headline example
This is a body text sample for checking how comfortable the pairing is to read.
Small text sample: captions and copyright notices.
This tool runs entirely in your browser. Your input is never uploaded.
How to use
- 1Choose a foreground text color and a background color
- 2Read the live contrast ratio
- 3Use the AA / AAA badges to check normal and large text
FAQ
What is the difference between AA and AAA?
WCAG AA requires at least 4.5:1 for normal text and 3:1 for large text. AAA is stricter at 7:1 and 4.5:1.
What counts as large text?
Usually 18pt (about 24px) or larger, or 14pt (about 18.66px) when bold.
How is the contrast ratio calculated?
Each color's relative luminance is computed with the WCAG formula, then (lighter + 0.05) / (darker + 0.05) gives the ratio.