What Your Website’s Colour Scheme Is Telling Users

How Surrounding Colours Change Perception

A warm gold tone on a dark background with restrained typography reads as considered and premium. The same colour on a cluttered white page with competing accents reads as fussy, or cheap. The background, the layout, and the other colours on the page are doing most of the communicating.

This is why “what colour should my button be?” is often the wrong question. A button’s colour only makes sense in relation to the rest of the palette, and contrast matters before colour does. A CTA that doesn’t stand out from its background fails regardless of its shade.

This is why two websites can use the same colour for their primary button and get completely different results. On one site it draws the eye immediately. On the other it blends into the page and gets missed. The colour gets the credit or the blame, but contrast is usually what’s actually doing the work.

When Bhode Vans came to me for a redesign, stripping back a cluttered layout and establishing clear visual hierarchy came before any colour decisions. Getting contrast right (making it obvious what to look at and in what order) was the foundation everything else was built on.

Sector context shapes this further. Every industry has established colour conventions, and visitors arrive with expectations shaped by every other site they’ve used. Departing from those conventions without good reason creates hesitation before anyone has read a word.

The Variety Funerals project is a good example. Funeral services typically defaults to dark, restrained palettes. The brand stepped away from that deliberately, using colour warmly and approachably. It worked because the rest of the design (the structure, the copy, the pace) held it in place. Without that context, the same colour choices would have felt wrong.

This connects directly to how visual hierarchy and the Von Restorff Effect work: the principle that what differs from its surroundings is what gets noticed.

What Inconsistent Colour Signals

Visitors use colour as a wayfinding system without realising it. The same button colour appearing across every page tells them where to look when they’re ready to act. When that consistency breaks down, they can’t always name what’s wrong. They just feel a low-level uncertainty that makes them less likely to proceed.

A useful framework here is the 60-30-10 rule: roughly 60% neutral (backgrounds and canvas), 30% secondary colour (structure, text, boundaries), and 10% accent, reserved strictly for CTAs and key actions. That 10% is what trains visitors to know where to look. When the accent colour appears on decorative elements or section dividers too, it loses its signal value.

This is what Jakob’s Law describes. Visitors build expectations from every other site they’ve used. When colour behaves predictably, they don’t have to think about it. When it doesn’t, they do.

The TR Stabilisation project is a practical example. The groundworks contractor, based between Accrington and Rossendale, had grown significantly but their site hadn’t kept pace. The mismatch between what the site communicated and what the business had become created doubt for new visitors before a conversation had even started. Bringing visual consistency in line with the professionalism of the operation was a core part of the redesign.

The Colour Mistakes Most SME Sites Make

Most colour problems aren’t the result of choosing the wrong shade. They’re the result of treating colour as a series of one-off decisions rather than a system.

Too many accent colours. Every additional colour competes for attention. The more colours in use, the harder visitors have to work to decode what each one means.

No single CTA colour. If the primary call to action appears in different colours across the site, visitors can’t build a reliable expectation of where to look. A button that’s teal on the homepage and dark blue on the contact page is doing half the job it could.

Brand colours that work in print but not on screen. A colour that looks strong on a business card can look flat or harsh on a monitor. If your brand colour was defined for print and never adapted for digital, it may be communicating something you didn’t intend.

Colour used to decorate rather than direct. Gradient overlays, coloured section backgrounds, and decorative dividers are common on SME sites and often serve no functional purpose. When colour doesn’t serve hierarchy or wayfinding, it adds noise without adding clarity.

RTC Safety Surfaces illustrates this well. The Burnley-based safety surfacing company operates worldwide, but their previous website created a brand disconnect that didn’t reflect the quality of the business. The redesign brought their online presence into alignment with the actual work.