Free tool · Accessibility
Pretty colors are no good if half your visitors squint at them. Check any text and background pair against WCAG, see it on real text and get a fix that still feels like your brand.
Your colors
Big headline text
This is how your body copy reads. If you have to squint here, so will your customers on a sunny day.
Small print and captions look like this.
Button outlineContrast ratio
3.24:1
2 of 5 checks pass. Fine for big headings and icons, too light for body text.
- AA normal textNeeds 4.5:1 · Body copy under 24pxFail
- AA large textNeeds 3:1 · 24px, or 19px boldPass
- AAA normal textNeeds 7:1 · The gold standardFail
- AAA large textNeeds 4.5:1 · Big headingsFail
- Buttons and iconsNeeds 3:1 · Borders, icons, focus ringsPass
Closest colors that pass
Same hue, just lighter or darker, so it still feels like your brand.
How to use it
Three minutes, tops.
- 1Enter your text color and background color as hex codes, or pick them with the color swatches.
- 2Check the ratio and the five results. Body text needs to pass AA normal text at 4.5 to 1.
- 3If it fails, tap one of the suggested colors. It keeps your hue and just moves it lighter or darker.
Questions
Things people ask me.
What contrast ratio do I need?
WCAG AA asks for 4.5 to 1 for normal text and 3 to 1 for large text, buttons and icons. AAA asks for 7 to 1 for normal text. AA is the usual target for business sites and what most accessibility laws point to.
What counts as large text?
Text that is at least 24 pixels, or at least about 19 pixels and bold. Most headings qualify. Body copy, captions and form labels usually do not.
Why does light gray text fail so often?
It looks elegant on a big monitor, but it washes out on phones, in sunlight and for anyone with low vision. It is the most common contrast problem I fix on client sites.
Does contrast affect SEO?
Not directly, but it affects whether people stay and read. Accessibility audits like Lighthouse flag low contrast, and a site that is easy to read keeps visitors around longer.
Runs entirely in your browser. Nothing you type leaves this page unless you hit save.