Colourful pastels closeup

How to Use Colour to Improve Your Website6 min read

Colour is all around us. More than that, colour can also affect how we feel which in turn affects what we do. This phenomenon is known as colour psychology and understanding its basic tenets can help you improve your website and ultimately your bottom line.

However, it’s not just about choosing one colour and calling it a day. Choosing the right colours that complement each other is equally important in making your website look great and perform even better. In this article, we will discuss three connected aspects of how to use colour so that you can choose the best colours for your website.

The psychology of colour

It is no secret that colours affect our moods. Red is passion, green is calm, blue is trustworthy. Colours greatly affects how we see things and many companies take great care in choosing the colour(s) to match the emotions they want to elicit from people.

It is safe to say that the emotion you choose, needs to tie in to your industry. As an example, computer companies such as hp, Dell, Lenovo, and Acer typically use the colour blue.

When you’re building a network of computers, or simply purchasing a laptop on which you will save your most important data, trust is more important than passion. The colour blue can also be found applied liberally to airline company logos; another case where trust is more important than anything else.

Understanding the emotions different colours bring out in us, can help you associate certain feelings with your website visitors. It is equally important to bring out the right emotions by understanding your audience and why they might want to purchase your products or services.

Action Plan Step 1: Understand the emotion that will get your target consumers to take the desired action and match the colour to that emotion.

Understanding colour relationships

Having a primary colour is great, however, this does not mean that your website should be slapped with a single paintbrush all over to get visitors to trust you even more. In fact, when talking about colours there are different colours we need to consider; colours that work together to form a palette.

Colour combinations that make up a palette should be chosen in a way that allows the colours to work with each other. There are several ways to do this which we will discuss briefly.

Complimentary colours

Complimentary colours are colours which are opposite each other on the colour wheel. When such colour combination is used, the colours compliment each other, helping each other stand out. The really interesting thing about complementary colours is that when combined, they cancel each other out.

Split-Complimentary colours

In split-complementary, instead of taking the colour that’s in direct opposition, we basically split the difference to either side, to end up with two complimentary colours. Using this methodology gives us an extra colour which we can use in more creative ambitions.


In Triadic, we can choose 3 colours from the colour wheel that are evenly spaced out. Of course, you will need to start with your primary colour, but this can give you another combination with two more colours that work just as well as the previous two.


If you need more colours, then you can use the tetradic model which allows you to choose four colours that are spread apart in the shape of a rectangle. This combination will give you more room to express things more creatively whilst ensuring that you remain consistent.

Pro Tip: Designers, generally recommend using the 60-30-10 rule where the different colour usage should be split in a 60-30-10 ratio.

There are different wheels you can use to pick your colour palette. RBG and CMYK are two such models, however, there are also other variations you can explore to identify which colour combinations you can ultimately use.

Action plan 2: Find the complimentary colour(s) of the primary colour you chose.

Hues, tints, tones and shades: nailing down the details

When it comes to selecting the actual colours, one of the best ways to do this is by using Pantones. Pantone is a colour standardisation system which has 3 distinct categories – Graphics, Fashion, and Product. When it comes to web design, it is the Graphics category that should be taken into consideration.

Now, it is important to note that the Graphics category is available in a number of formats including paper, plastic, and digital. The good news about this is that the same system used for your web design can also be used for any of your printed collateral.

In the graphics category, there are 4 categories that can be considered; Core, Pastels, Neons, and Metallics so be sure to take the time to shop around. There is no need to purchase the actual guides; you can use this system to find the exact colour combinations you want after which a professional designer should be able to walk you through the rest of the process.

Action plan step 3: Pick the actual colours you feel best suit your brand. Take note of the Pantone code which you can also convert to a HEX or RGB code which is widely used in editing applications such as those supplied by Adobe.

Colour can be used to your advantage. By picking the right colour combinations your brand will appear more cohesive and will be better equipped to deliver the message you want it to.

If you’re unsure, reach out to us and we can guide you through the process including best-practice execution to make sure that you can always shine.

Leave a Reply

Your email address will not be published.