For design systems
Colour contrast.
Test a text and background colour pair against WCAG 2.2 AA and AAA text-contrast thresholds. See the result on a real preview and export the numbers with the colours.
Preview
Website widgetEmbed code
Paste into an HTML block where you want the tool. The credit is included. Platform instructions · Licence
How it works
- AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 and 4.5:1 respectively. Pass/fail uses the unrounded ratio.
- Large text means at least 24 CSS pixels, or about 18.67 CSS pixels when bold. A colour pass does not assess font legibility or the rest of a page’s accessibility.
- This checks solid, opaque sRGB colours. Gradients, image backgrounds, transparency and APCA are not evaluated.
Uses & downloads
Brand guides, design systems and accessible interface work.
Interactive website widget + JSON result. No account or API key. A visible credit is included in the website component.
Plain-text instructions for developers & AI assistants →Installation & customisation
Contact us for help adding the tool to your site, changing its design or using it without the credit link.