Color contrast checker
Check at a glance whether your text and background colours have enough contrast under WCAG AA and AAA. Pick two colours and instantly see the contrast ratio — everything is calculated right in your own browser.
Contrast ratio
14.63: 1
Sample text
Large sample text
This is how the pair looks in the real world.
Calculated in your browser — nothing is stored or sent.
What do the WCAG levels mean?
The contrast ratio runs from 1:1 (no difference) to 21:1 (black on white). The higher the number, the more legible. WCAG has two levels: AA (widely used and often required) and the stricter AAA.
AA — normal text
4.5:1
The minimum for regular text. Often legally required.
AA — large text
3:1
For text from ± 18.66px bold or 24px regular.
AAA — normal text
7:1
The strictest level, for maximum legibility.
Note: contrast is just one part of accessibility. Never rely on colour alone to convey information — combine it with text, icons or patterns so everyone gets the message.
Frequently asked questions
What is a good contrast?
For normal text, WCAG recommends a contrast ratio of at least 4.5:1 (level AA). Large text — from roughly 18.66px bold or 24px — may be 3:1. To meet the stricter AAA level you need 7:1 for normal text and 4.5:1 for large text.
What does WCAG AA mean?
WCAG (Web Content Accessibility Guidelines) is the international standard for accessible websites. Level AA is the most widely used level and is legally required in many countries for (semi-)government bodies. For contrast, AA means at least 4.5:1 for normal text and 3:1 for large text.
Is this tool free?
Yes, the contrast checker is completely free and without obligation. You don't need to leave any details — every calculation happens right in your own browser, and nothing is stored or sent.
Need an accessible website?
We build websites that don't just look good, but also meet WCAG. Tell us about your plan and you'll receive a free, no-obligation quote.