I’ll start with a confession. Holler’s brand orange fails an accessibility test.
Not the orange itself. The orange is fine. It’s bright, it’s confident, it looks great on a dark background. But put white text on top of it, the way you’d style a button, and the contrast ratio comes out around 2.8 to 1. The web accessibility standard most organizations are measured against asks for 4.5 to 1 for normal text.
So I’m not writing this from a high horse. I’m writing it from the same paint aisle you’re standing in.
A logo is meant to be seen. A website is meant to be read.
This one actually happened to me. I picked a paint colour for the whole house off a two-inch chip. A nice, safe, neutral grey. Held it up to the light, loved it, bought the paint. Then it went on the walls, and the entire house turned purple.
The chip wasn’t wrong. It just wasn’t tested at the size and in the conditions you were actually going to live with.
Brand colours work the same way. A good logo designer is solving for recognition. Will this stand out on a sign? On a truck? On a coffee cup across a trade show floor? Those are glance-length jobs. Big shapes, short looks, nobody reading a paragraph.
Even the accessibility rules let logos off the hook. The contrast requirements specifically exempt text that’s part of a logo or brand name. So nobody checks, because nobody has to.
The trouble starts when the brand guide lands on a web designer’s desk and that chip becomes a wall. Your orange turns into every button. Your soft sage turns into link text. Your elegant pale grey turns into the body copy someone has to read on their phone, outside, in March, with the brightness turned down to save battery.
Where it usually goes wrong
The repeat offenders are the cheerful colours. Oranges, yellows, bright greens, sky blues. They’re bright because they’re light, and light colours don’t leave much room for white text to stand out against them.
The other common one runs the opposite direction: a light brand colour used as text on a white page. Pale links. Pastel headings. The “subtle” grey that a designer picked because it looked refined in a mockup on a large monitor.
None of this shows up in the brand guide. It shows up when someone with low vision can’t find your Book Now button, when your site gets flagged in an accessibility audit, or when you just notice people aren’t clicking the thing you most want them to click. Contrast isn’t only a compliance box. Buttons people can’t easily read are buttons people don’t press.
Why this is worth caring about
It’s easy to file accessibility under “nice to have.” The numbers say otherwise. In 2022, 27% of Canadians aged 15 and older, about 8 million people, had at least one disability that limited their daily activities, according to Statistics Canada’s Canadian Survey on Disability. In Alberta the rate was 27.5%.
That’s more than one in four people who might land on your site. And it doesn’t count everyone else who is temporarily in the same boat: reading on a phone in bright sun, squinting through a cracked screen, or simply getting older and noticing that small grey text isn’t as easy as it used to be.
There’s a rules side to this too, and it’s tightening. Ontario has required public sector organizations and businesses or non-profits with 50 or more employees to meet the WCAG 2.0 AA web standard since January 1, 2021. That standard is where the 4.5 to 1 contrast ratio comes from. Corporations that don’t comply can be fined up to $100,000 a day.
Ontario isn’t alone. Most provinces now have accessibility legislation of their own. Alberta is one of only two that don’t, alongside PEI, and a bill to create one didn’t pass this spring. So if you’re an Alberta organization, nobody is fining you over your button colours today. If you have staff in Ontario, though, those rules may already apply to you. And betting that the rest of the country will never pull Alberta along is not a bet I’d make with a website you plan to keep for five years.
Accessible design isn’t a special version of your website for a few people. It’s your website working properly for everyone. The visitor who can comfortably read your button is the one who can press it.
You don’t need a rebrand. You need a web palette.
Here’s the good news. Fixing this almost never means touching your logo, and it doesn’t call for a full redesign either.
Go back to the paint aisle. You don’t return the colour you love. You keep it for the trim and the feature wall, and you pick a couple of shades from the same strip for the big surfaces.
That’s what a web palette is. Your true brand colour stays exactly where it shines: the logo, accents, illustrations, big blocks of colour with nothing to read on them. Then you add a slightly darker working shade for anything carrying text.
With my own orange, the fix is almost boring. Swap the white button text for our dark charcoal and the contrast jumps to roughly 6.7 to 1. Or keep white text and deepen the orange to a burnt shade, which clears 5 to 1. Same family. Nobody looking at the site would say the brand changed. They’d just be able to read the button.
The point isn’t that logo designers are doing it wrong. They’re doing a different job. Someone just needs to check the colours against the job they’re about to do on your website.
And while we’re here: skip the pure black and white
Once people learn contrast matters, the tempting fix is to crank it all the way up. Pure black text on pure white. Maximum contrast, problem solved.
It’s the paint aisle again. Hardly anyone paints a living room in pure, untinted white. It’s harsh, it bounces light everywhere, and it makes the room feel like a dentist’s office. The whites people actually live with have a little warmth or grey mixed in.
Screens behave the same way. Pure black on pure white is the highest contrast a screen can produce, and on a bright phone that glare is tiring over a long read. Many readers, including people with astigmatism, find the letters start to shimmer or blur at the edges. Flip it to white on black for a dark design and the effect gets worse: bright text seems to bleed into the background around it.
The goal was never maximum contrast. It’s enough contrast. A near-black on a soft off-white still clears the accessibility bar with a huge margin, and it’s far kinder to read.
Holler’s site practices this one, at least. The dark background is a deep charcoal, not true black, and the text is an off-white rather than pure white. You probably never noticed. That’s the point.
Want a second set of eyes?
If you’ve got a nagging feeling your buttons are a bit hard to read, they probably are. Book a quick chat at meetwithjames.ca and I’ll run your brand colours against your site and tell you which ones are pulling their weight and which ones need a working shade. No rebrand required.
Written by