Essential Colour Guide for Designers: Understanding Colour Theory

in Resources / Learning

Colour plays a major role in any brand's visual identity. It can set the mood, attract attention and even spark emotions – in some cases, it can cause physical reactions, so it's important to get right. Whether designing something for yourself or a client, your choice of hue for logos, campaigns, websites or advertisements will massively determine how the brand is perceived by the public.

With this in mind, you'll want to ensure you choose the right palette to win over the target customer. That's where colour theory helpfully steps in. It's the very study of colour, and a science in itself. So before you start to consider colour choices, read the following guide, so you can gain a better understanding behind the meaning of colour.

We will explore the basics of colour theory that you'll need to get your head around – the colour wheel, colour harmony and the context in which colours are used. We'll also give you some tips on colour schemes. Then we'll take a deeper look at individual colours and how they're perceived.

The Colour Wheel

The colour wheel – or colour circle – is a basic but completely essential tool for combining colours and is designed in such a way that virtually any colours you pick from it will look beautiful together.

The first ever circular diagram was created by Sir Isaac Newton in 1666. Many versions have since been created, but the most common is a wheel of 12 colours based on the RYB colour model. The above colour wheel shows the relationships between primary, secondary and tertiary colours, while the version below – courtesy of Mint Creatives – displays which of the colours are considered 'warm' or 'cool', and then the tints, shades and tones of each colour. Read on to discover more about these aspects of the colour wheel.

Primary, Secondary & Tertiary Colours

In traditional colour theory, primary colours are the three pigment colours – red, yellow and blue – that can be mixed together to form any combination of other colours. Which means all other colours are derived from these three hues.

Green, orange and purple make up the secondary colours – formed by mixing the primary. While tertiary colours are created by combining primary and secondary colours, for example yellow-orange, red-orange, red-purple, blue-purple, blue-green and yellow-green. And because you mix primary and secondary colours, that's why tertiary colours get their two word names.

Warm and Cool Colours

There's nothing complicated about deciphering warm colours from cooler ones. The colour wheel does it all for you. Split down the middle, it reveals which of the 12 colour wheel hues are cool and which are warm.

Warm colours – red, orange, yellow and variations of these three colours – are vibrant and full of energy. Cool colours – green, blue and violet – offer calm and tranquility, and they're often more subdued than warm colours.

White, black and grey – on the other hand – are considered to be neutral.

Tints, Shades and Tones

Simply put – tints, shades and tones are basic colour concepts where you can either:

make a colour lighter by adding white – the resulting colour is a tint;
make a colour darker by adding black – the darker version is known as a shade;
add grey to create a completely different tone.

Colour Harmony

Now we've covered the colour wheel basics, it's time to look at colour harmony. And when it comes to harmony in colour, you're looking for what are considered to be pleasing-on-the-eye arrangements and combinations.

Because when colours don't match, they can definitely clash or just be considered boring. And you certainly don't want to give off the wrong vibe. Use the following basic techniques from the trusty colour wheel to help you create your own harmonious colour schemes...

1. Complementary

Image credit: [TwoTales](http://twotales.org/)

Image credit: TwoTales

Complementary colours are those that lie opposite each other on the colour wheel. Red and green are complementary colours, as are red-purple and yellow-green. These high contrast combinations create a vibrant look and must be handled with care. They're certainly tricky to use in large doses, but can be very effective for making certain elements stand out.

2. Analogous

Image credit: [TwoTales](http://twotales.org/)

Image credit: TwoTales

Analogous colours lie next to each other on the colour wheel. They typically combine beautifully and create appealing schemes for your designs. In fact, analogous are often found in nature and are always harmonious and pleasing on the eye.

Just make sure you have enough contrast in your chosen analogous scheme, i.e. use one dominant colour, the second as a support and the third as an accent.

3. Triad

Image credit: [TwoTales](http://twotales.org/)

Image credit: TwoTales

Triadic colours are those that are evenly spaced out around the colour wheel, as though you're looking at an equilateral triangle. These colour combinations tend to be quite vibrant, even if you opt for paler versions of your hues.

Similar to analogous, it's important to achieve harmony and balance between the three colours that you choose – so one dominant, while the other two should be accents.

4. Split-Complementary

Image credit: [TwoTales](http://twotales.org/)

Image credit: TwoTales

A variation of the complementary colour scheme, the split-complementary technique takes a base colour and then uses the two adjacent colours as its complement. Again, this scheme delivers high contrast combinations but they're not considered to be as harsh.

If you're a beginner, then this scheme is perfect for you – as it's incredibly difficult to mess up.

5. Rectangle

Image credit: [TwoTales](http://twotales.org/)

Image credit: TwoTales

With the rectangle, or tetradic colour scheme – you'll use four colours arranged into two complementary pairs, creating rich and beautiful combinations. Just make sure you let one colour be dominant. And pay close attention to the balance between warm and cool colours for your designs.

6. Square

Image credit: [TwoTales](http://twotales.org/)

Image credit: TwoTales

The square colour scheme is similar to the rectangle, however this time, you've got all four colours evenly spaced around the colour wheel. Just like the rectangle scheme, you've got to allow one colour to play the dominant role. And watch out for the harmony between warm and cool colours.

The Meaning of Colour

Now that we've covered the basics of colour theory, let's take a look at the meaning behind all six of the main primary and secondary colours of the famous colour wheel:

Red

Red is all about fire and passion. So, as you can imagine, it's associated with energy, danger, strength, power and absolute determination. It's also the colour of desire and love. It's certainly very emotionally intense and can even have a physical impact on humans – raising their heart rates and blood pressure. It's why the fire service and most stop signs are red, pointing to warnings or danger that people will pay attention to.

From a designer's point of view, it's great for grabbing attention to important information or calls to action – really helping to get a message across and encourage quick decision making. It's like your design is saying 'attention!' or 'take action!'. Definitely the colour of choice for making people do exactly what you want.

Orange

Orange is the colour of communication and optimism. It combines the energy of red and the happiness of yellow, and supposedly increases oxygen supply to the brain – producing an invigorating effect. And as it's considered to be a warm colour, it can give the sensation of heat.

Just like red, orange can be used to draw attention to important aspects of your designs. It's also a good choice if you're promoting something like children's products or even food.

Yellow

The colour of sunshine – yellow brings joy, happiness and energy. It's also considered to align with intellect and the mind. Giving off a warm glow, it's believed to actually stimulate the brain. This is the colour you also use if you want to evoke pleasant and friendly feelings.

Yellow is often used to promote products and services in the leisure industry, and children's toys. It's also another great colour for attracting attention. But be warned! Yellow isn't something you use for high-end goods or services, because it's too lighthearted and seemingly childish. It's also not exactly the most 'stable' of colours, so avoid like the plague if you're designing for a serious or more grownup brand.

Green

Green is all about nature, as well as balance and growth. It symbolises harmony, fertility and is strongly associated with safety – think about the 'green man' on traffic lights. Many believe it has a healing power, is very restful on the eye and can even improve vision. Green is certainly solid and reliable.

If choosing green for your designs, it's ideal for evoking safety and solidarity. So think medical products or anything that definitely needs to be perceived as stable. As green is related to nature, it's also the best choice when designing for eco brands.

Blue

The colour of the sky and sea, blue brings trust, calm and peace to one and all. It evokes loyalty and integrity as well as conservatism. Considered to be a sensible choice of colour and one that many corporations and brands favour, you can understand why blue is the most used colour on the internet. Supposedly beneficial to both body and mind, blue slows our metabolisms and helps us to enjoy pureness, tranquility and stability.

Blue is the perfect choice if you're designing for brands related to safety and/or cleanliness such as cleaning products, airlines or mineral water.

Violet

Violet brings together the power of red and the calm of blue. Associated with royalty, it's a powerful colour choice and is associated with luxury, nobility and ambition. It's what brings to mind wealth and prosperity with a dashing of extravagance thrown in for good measure.

And because violet is associated with all of these rich and regal elements, it's ideal for luxury brands and high-end goods and services.

Further Reading

To help further in your studies of colour theory, check out the following helpful resources:

  1. Colour Theory for Designers: The Meaning of Color – Smashing Magazine

  2. Color Wheel Pro - Color Meaning – Color Wheel Pro

  3. Basic Color Theory – Color Matters

  4. Color – Wikipedia's own guide to colour

  5. Color Theory Intro – Tiger Color

Close