Colour Contrast Checker — Exact WCAG Ratio

Pick two colours, get the contrast ratio to two decimals and whether it passes WCAG 2.1 AA or AAA for normal and large text.

Quick answer: Check colour contrast free: enter foreground and background colours, get the exact WCAG contrast ratio and pass/fail for AA and AAA at normal and large text size.

contrast ratio
AA normal (4.5:1)
AA large (3:1)
AAA normal (7:1)

How to use

  1. Pick the text colour and the background colour.
  2. Read the ratio and the AA/AAA results.
  3. Adjust until it passes.

About this tool

About one in twelve men has some colour vision deficiency, and low-contrast text fails far more people than that — outdoors on a phone, low contrast makes text unreadable for almost everyone. WCAG 2.1 sets the thresholds: 4.5:1 for normal text at AA, 3:1 for large text, and 7:1 for AAA. This checker computes the real relative-luminance ratio rather than a rough guess, tells you pass or fail at each level, and suggests how far you need to move the foreground colour to pass. Useful for designers, and it is the fastest way to check a slide or a poster before you print it.

FAQ

Is anything uploaded?
No — the calculation runs in your browser.
What ratio do I need?
4.5:1 for normal text at AA, 3:1 for large text (18pt or 14pt bold), 7:1 for AAA.
Why is my yellow-on-white failing?
Yellow has high luminance, so it is close to white — the ratio ends up near 1.5:1.
Does it check non-text elements?
The 3:1 threshold applies to UI components and graphics too.
Is a higher ratio always better?
Up to a point — very high contrast can cause halation for some readers, so pure black on pure white is not automatically ideal.
Can I copy the hex codes?
Yes — the copy button gives you both.

Questions people ask about Colour Contrast Checker (WCAG)

Collected from live search results on 31 Aug 2026 (search-engine "people also ask" boxes plus the questions published on ranking pages).

how to use color contrast checker
The Toolfyra Colour Contrast Checker (WCAG) runs entirely in your browser: open it, enter your input and the result appears instantly. No sign-up, no file upload, no watermark, and it works on phones as well as desktop.
what is color contrast checker
The Toolfyra Colour Contrast Checker (WCAG) runs entirely in your browser: open it, enter your input and the result appears instantly. No sign-up, no file upload, no watermark, and it works on phones as well as desktop.
how to use wcag color contrast checker
The Toolfyra Colour Contrast Checker (WCAG) runs entirely in your browser: open it, enter your input and the result appears instantly. No sign-up, no file upload, no watermark, and it works on phones as well as desktop.
how to use webaim color contrast checker
The Toolfyra Colour Contrast Checker (WCAG) runs entirely in your browser: open it, enter your input and the result appears instantly. No sign-up, no file upload, no watermark, and it works on phones as well as desktop.
how to check color contrast
The Toolfyra Colour Contrast Checker (WCAG) runs entirely in your browser: open it, enter your input and the result appears instantly. No sign-up, no file upload, no watermark, and it works on phones as well as desktop.
how to measure color contrast
The Toolfyra Colour Contrast Checker (WCAG) runs entirely in your browser: open it, enter your input and the result appears instantly. No sign-up, no file upload, no watermark, and it works on phones as well as desktop.