Color Contrast Checker
Check text and background contrast against WCAG AA and AAA thresholds.
Runs in your browser using WCAG 2.1 relative luminance — nothing is uploaded
How to use it
- Set the text and background colours.
- The ratio and each WCAG result update immediately, with a live preview at both text sizes.
Questions
What counts as large text?
From 18.66px bold, or 24px at any weight. Large text needs 3:1 for AA where normal text needs 4.5:1.
Is passing AA enough?
AA is the level most legislation references and is a sound target. AAA (7:1) is worth reaching for body text where you can, but it constrains your palette considerably.
Why does this differ from my design tool?
Usually because of alpha. The ratio is defined for solid colours, so a semi-transparent text colour must be composited against its background first. This tool does that compositing for you.