Check the contrast ratio between a foreground and background colour against WCAG 2.2 requirements, with clear pass or fail results for AA and AAA at both normal and large text sizes.
Getting started
Set your text colour and your background colour.
Read the calculated contrast ratio and the pass or fail badges for each WCAG level.
Check the live preview at both text sizes to confirm it reads comfortably.
Why it helps
Reports every relevant WCAG threshold at once instead of a single verdict.
Live preview at real text sizes shows what the ratio means in practice.
Catches accessibility problems at design time, when they cost minutes rather than months.
In practice
Verifying a brand colour is usable for body text before it ships.
Checking a button's label against its background colour.
Auditing an existing interface against accessibility requirements.
Everything people ask most about the colour contrast checker, answered plainly.
Keep exploring
More from Colour Tools and beyond — most people who use this one reach for these next.
