Learning never exhausts the mind
Home >  Web Design > Graphic Design > Colour Theory – Tips and Inspiration

Published 20th February 2016 by

Colour is by far one of the most important elements in graphic design. Different colours evoke different feelings. This article explains how colours can be used to create feelings and moods.
Graphic Design Series
  1. What is Graphic Design?
  2. Graphic Design Elements & Principles
  3. Colour Theory - Tips and Inspiration
  4. Everything You Wanted to Know About Typography
  5. Introduction to Adobe Photoshop
  6. Introduction to Photo Editing
  7. Creating Web Designs in Photoshop
  8. Introduction to Adobe Illustrator
  9. Tracing Artwork in Adobe Illustrator
  10. Logo Design
  11. Introduction to the Printing Process

What is Colour?

Colour exists all around us, but have you ever thought to yourself "Why is that apple red?" It is because physical objects, when hit by light, will absorb and reflect light to your eyes. When white light hits the apple, all the wavelengths of the light are absorbed apart from red, which is reflected back to your eyes and so the apple appears to be red. The study of absorption and reflection of light is called spectroscopy, and the link explains more about the science if you wish to read more.

Red Apple

Red Apple

How to Use Colour

The colour wheel is attributed to Isacc Newton around 1666. Below is a diagram of the colour wheel and illustrates a number of important concepts. The colour wheel is a visual tool to help comprehend the rules of colour theory.

Colour Theory Wheel

Colour Theory Wheel

The colour wheel specifies the three primary colours - red, blue and yellow. It also specifies three secondary colours - orange, green and purple, which are created my mixing two primary colours. Finally it specifies 6 tertiary colours - made my mixing a secondary colour and a primary colour. The colour wheel is used to create colour schemes by identifying colours that go well together or compliment each other.

Complimentary colours are any two colours that are directly opposite each other, for example, red and green. They are also called contrasting colours. This is a key concept to understand how contrasting colours is used in a design.

Think of a lifebuoy, or emergency dingy or even a lifeboat. They are predominantly orange in colour. Looking across the colour wheel, the opposite colour or contrasting colour is blue, the colour of the sea. The contract between the two makes the orange life raft stand out as much as possible against the blue of the sea.

Analogous colours are basically the safest bet when considering graphic design. Typically pick a starting colour and work with the colours immediately surrounding that it. These colours will go together very well. For example using a base colour of yellow, the analogous colours would be the oranges and greens.

Triad colours are any three colours that are equidistant on the colour wheel.

Tints and Shades

When you add white to a colour, you make it lighter. These are called tints. When you add black to a colour, you make it darker. These are called shades. Tints and shades are used everywhere when working with designs. Shades are often stronger, bolder colours, while tints are lighter and more washed out. The diagram below shows various colours with tints and shades.

Tints and Shades Colour Wheel

Tints and Shades Colour Wheel

Colours and Emotions

Colour is an important tool for non-verbal communication. When you see a colour we naturally assign feelings and emotions to it. For example, warm colours have feelings of energy, power, passion and cheerfulness. Cool colours are seen as more refreshing, reliable and trustworthy. Because of this colour plays a significant role in brand perception. Plutchik's wheel of emotions is shown below and this graphically shows the range and strength of emotions attributed to a given colour. This can be particularly useful for logo and web design, as the choice of colour can dictate the level of trust or help convey a brand message.

Plutchik&squo;s wheel of emotions

Plutchik&squo;s wheel of emotions

Tutorial Series

This post is part of the series Graphic Design. Use the links below to advance to the next tutorial in the couse, or go back and see the previous in the tutorial series.

Leave a Reply

Fields marked with * are mandatory.

We respect your privacy, and will not make your email public. Hashed email address may be checked against Gravatar service to retrieve avatars. This site uses Akismet to reduce spam. Learn how your comment data is processed.