🎨 Everything runs in your browser. No install, no sign-up.
A heading looks like this
Body text reads at about this weight.
Small text like a caption gets this small — insufficient contrast shows up here first.
Contrast ratio
3.68 : 1
Only usable at large sizes
Fail
AA body
4.5:1
Pass
AA large
3:1
Fail
AAA body
7:1
Fail
AAA large
4.5:1
What the levels mean
- · AA 4.5:1 — the baseline for web accessibility. Body text has to clear this.
- · 3:1 — from 18pt (or 14pt bold) the threshold drops.
- · AAA 7:1 — the stricter level, sometimes required for public-sector sites.
- Contrast is decided by difference in lightness, not by hue. That is why white text on yellow is unreadable even though the colours are different.
What this tool does
- Contrast ratio from 1 to 21
- AA and AAA pass or fail
- Separate verdict for large text
- Auto-adjust lightness until it passes
Other colour tools
Colours may look slightly different depending on your screen and its colour profile.