Skip to main content

Introducing our free color contrast checker

Andy Biggs
··3 min read
New Feature

A grid of eighteen color swatches, each showing sample text on a background with its contrast ratio and a pass or fail mark. The muted greys fail; the darker tones and A11y Pulse pinks pass.

Has anyone else noticed the sea of grey that is the modern web? In the world of product design we’ve all become obsessed with copying Linear’s app or the Claude desktop app. But in doing so we run the risk of designing a site that’s inaccessible because it doesn’t have enough color contrast. While I’m sure both Linear and Anthropic have considered contrast and keep it within WCAG guidelines, I’m not so sure the copies of their sites have.

I’m a designer by training, and color contrast is the accessibility issue I’ve noticed most designers care about. Actually, in almost all the companies I’ve worked in, it’s the only one they care about.

Today’s post is all about letting our loyal followers know that we have released a free color contrast checker tool on our marketing site. It’s not revolutionary, but it is fast and easy to use.

Like all the other color contrast checkers I’ve used, it lets you check a foreground color against a background color. It then gives you pass or fail ratings for the WCAG guidelines for normal text, large text and graphical elements at both AA and AAA conformance levels.

The color contrast checker with grey #8a8a8a on light grey #f2f2f2, scoring 3.08:1. Normal text fails AA and AAA, while large text and non-text elements pass AA.

If you’d like to learn a little more about how all those ratings work, I recommend this blog post.

Check one color pair, or your whole site

Designers, why not try out the checker next time you are dubious about a grey on grey situation? Or even better, fire up A11y Pulse itself and put the website you work on into it. That way you won’t just check color contrast for one situation, you’ll be checking it across the entire website. Not only that, you’ll start to discover some of the other things that matter in the world of accessibility.

In case you or your manager need motivation, the World Health Organization estimates 1.3 billion people live with a disability, and at least 2.2 billion people have some form of vision impairment. That’s over a quarter of the world’s population.

How much of your potential customer market is your current site not catering for? Keep in mind we are also living longer thanks to modern health care, so the number of people living with a disability is growing as well. Many of those people are your potential customers.

Not using A11y Pulse yet? Sign up for a free trial and see how easy it is to bring continuous accessibility testing into your team's workflow.

Questions? We would love to hear from you. Drop us a line at [email protected].