Colour contrast: a practical guide

We end up explaining this on discovery calls often enough that it deserved writing down. This guide covers what colour contrast actually involves, where it usually goes wrong, and how to tell whether yours is in reasonable shape.

The measurable part of design is whether people can find what they came for and act on it without hesitating. Nothing below assumes a large team or a large budget — most of it is a decision somebody has to make and then write down.

What is actually at stake

Body text needs a 4.5:1 contrast ratio against its background. This is the sort of thing that compounds, quietly, in both directions. Most teams find the first pass takes an afternoon and the maintenance takes minutes a month.

For most businesses the question is not whether this matters but how much of it is worth doing right now. That depends on what you are trying to achieve in the next few months, not on best practice in the abstract. That sounds obvious written down. It is still the thing most often skipped.

How we handle it

Light grey on white fails more often than designers expect. There is a version of this that is over-engineered, and it is worth avoiding. The teams that stay on top of it are the ones who put it on a calendar rather than a wish list.

Consistency is the quiet half of design work: it rarely gets complimented, and its absence is noticed immediately. The version that works in practice is usually less elaborate than the version described in the guides.

Contrast checkers take seconds and settle arguments. This is the sort of thing that compounds, quietly, in both directions. If two people in the business would answer this differently, that gap is the actual problem.

A working checklist

If you want a quick read on where you stand, work through this. Anything you cannot answer confidently is where to start.

• Body text needs a 4.5:1 contrast ratio against its background
• Light grey on white fails more often than designers expect
• Contrast checkers take seconds and settle arguments
• Someone is named as the owner, not just assumed to be
• There is a date in the calendar to review it again
• The decision and the reasoning behind it are written down somewhere findable
• You could explain the current setup to a new hire in five minutes

The mistakes we see most

The most common failure is not doing this badly. It is doing it once, during a launch, and never revisiting it. Circumstances move, the setup does not, and the gap widens quietly until something breaks or somebody notices the numbers.

• It was configured during a launch and has not been touched since
• Different people in the business believe different things are true about it
• There is no way to tell whether the last change helped or hurt
• The only person who understands it has left, or is about to

Design decisions are the ones clients feel most confident arguing about, which makes it worth separating taste from evidence early. There is a version of this that is over-engineered, and it is worth avoiding.

How we approach it

On our projects this gets handled during the build rather than added afterwards, because retrofitting it costs several times more than including it. We write down what was decided and why, so the next person to touch it is not guessing.

If you are working with someone else, the questions worth asking are simple: who owns this, how will we know it is working, and what happens when it needs to change?

Where to go from here

Pick the single item from the checklist above that would cause the most trouble if it turned out to be wrong. Fix that one, confirm it worked, then move on. Most of the value here comes from doing the first two things, not all of them.