brand

The Power of Colour in User Experience

Orlagh McC

When was the last time a website felt so intuitive and engaging that you didn’t think twice about navigating it?

Chances are, colour played a bigger role than you realised. The right colour choices are a strategic tool for shaping how users interact with and feel about your product.

A carefully crafted UX colour palette can transform a design from functional to exceptional. In contrast, poor colour choices can confuse users, disrupt navigation, and even undermine trust in your brand. Thoughtful colour design isn’t optional - it’s essential to delivering an intuitive and seamless user experience.

Here are 3 ways that colour can influence how your target user interacts with your brand touchpoints:

Emotions

All colours can subconsciously evoke different feelings and emotions, and they are usually universal (it’s important to note that some colour associations can vary in different cultures). These responses can determine how the user interacts with your brand or website.

For example, red is typically associated with danger or immediacy, which is why it works effectively for error messages.

By aligning colour choices with user expectations and emotional triggers, you can create a more intuitive experiences.

‍

Accessibility

Accessibility is not something that should ever be overlooked in UX, especially when it comes to colour. It’s important to ensure your digital products are equitable, which essentially means that everyone can have a positive experience using them - regardless of ability.

One important thing to consider is colour contrast. Colour contrast tools are useful for checking if text is clear enough to read, depending on the colour combinations used.

In 2015, there were an estimated 253 million people with visual impairment worldwide.

Different types of colour blindness can drastically effect how a user views the colours used on your product, so checking these meet accessibility standards will ensure that everyone has a smooth, enjoyable experience on your website.

‍

Visual Balance

Colour can serve as a fantastic tool to establish information hierarchy, drawing the user’s eye to important information. By balancing how elements are organised in a design, you can achieve a decrease in cognitive load (how much information the user has to absorb and process), meaning that conversions/tasks will be completed quicker and the user’s experience will be more enjoyable overall.

A great rule to live by when applying colours to designs is by using the 60/30/10 rule. Using a neutral colour with good contrast (shades of black or white typically) serves as a foundation colour.

A secondary colour (30% of the design) can add harmony, and is usually drawn from brand guidelines to ensure continuity and brand recognition. This is useful for drawing attention to features or components.

The remaining 10% serves as a contrast, something that the user will be easily drawn to. This is best used sparingly for call-to-action buttons or hyperlinks.

‍

Bonus Tip

‍

‘I have brand guidelines, but they don’t meet some contrast checks for web. I don’t have budget for a new brand, but it’s important to me that my website is accessible. What do I do?’

‍

It’s important to keep brand continuity across different touchpoints. If your website looked completely different to your brand, some users will assume they’ve landed on the wrong site resulting in higher bounce rates.

A simple way around this is by using different shades (adding black) and tints (adding white) of your brand colours. By doing this, you can achieve a good contrast while maintaining the essence of your brand.

‍

Want to optimise your website for a better User Experience? We can help with audits, consultancy and design. Get in touch to book a free 30 minute discovery call.