Free WCAG contrast checker for real accessibility
Pick a foreground and background — see the ratio, AA/AAA badges for normal + large text, live preview, and one-click auto-fix.
Runs entirely in your browser using the standard WCAG 2.1 relative-luminance formula. No signup, no data sent anywhere.
The thresholds you need
- AA normal text — 4.5:1 minimum
- AA large text — 3:1 minimum (18pt or 14pt bold)
- AAA normal text — 7:1 minimum
- AAA large text — 4.5:1 minimum
- Non-text UI (icons, borders, focus rings) — 3:1 under WCAG 2.1
Frequently asked
What does the ratio actually mean?
Ratio = (L1 + 0.05) / (L2 + 0.05), where L1 and L2 are relative luminance of the lighter and darker colors. 1:1 = identical (invisible text). 21:1 = pure black on pure white (max).
Why does my brand color fail AA?
Many trendy brand colors (soft pastels, neon on white, dark grays on dark) fail AA. Use the auto-fix to nudge lightness while keeping hue — usually preserves brand feel while gaining accessibility.
Does hue matter?
No — WCAG 2.1 contrast is purely luminance-based. Yellow-on-white and red-on-white are equally failing regardless of hue.
What about APCA (WCAG 3)?
APCA is a proposed replacement in the WCAG 3 draft. Not yet ratified. This tool uses the current WCAG 2.1 formula as of 2026.
Is my data uploaded?
No, everything runs locally.
Commercial use?
Yes, free for any use, no attribution required.