Color contrast checker
Check instantly whether your text and background colors are readable according to WCAG. If the ratio is too low, the tool finds the nearest passing shade for you.
Free · No sign-up · Runs in your browser
| AA | AAA | |
|---|---|---|
| Normal text | ||
| Large text | ||
| UI components | — |
Large heading sample
The quick brown fox jumps over the lazy dog.
Check instantly whether your text and background colors are readable according to WCAG. If the ratio is too low, the tool finds the nearest passing shade for you.
ButtonYour files are never uploaded; everything runs in your browser.
How to use
- Pick the text and background colors or type their HEX codes.
- Review the contrast ratio and the WCAG AA / AAA results.
- See how normal and large text look in the preview.
- If needed, click the suggested color to switch to a passing shade; share the page address to pass the result on.
Highlights
- WCAG 2.2 AA and AAA results for normal and large text.
- 3:1 check for UI components (buttons, icons, borders).
- Nearest passing shade suggestion for failing colors.
- Shareable link: colors are saved in the page address.
Frequently asked questions
What is the WCAG contrast ratio?
The contrast ratio is the difference between the relative luminance of two colors and ranges from 1:1 to 21:1. WCAG recommends at least 4.5:1 (AA) and 7:1 (AAA) for normal text.
What counts as large text?
Under WCAG, large text is regular text of 24 px (18 pt) or more, or bold text of about 18.66 px (14 pt) or more. The AA threshold for large text is 3:1.
Do logos need to meet contrast rules?
No. Under WCAG, text that is part of a logo or brand name is exempt from the contrast requirement. Sufficient contrast is still recommended for readability.
Why does contrast matter in social media graphics?
Graphics are mostly viewed quickly, on small screens and in bright surroundings. Enough contrast makes the message readable at a glance and improves accessibility for people with low vision.
Need a professional design?
Get in touch for social media design, advertising visuals, posters, logos and brand identity projects.