The Colour Wheel and Colour Harmonies – Understanding Colour Theory, Part 4

Understanding the Colour Theory, Part 1
Understanding the Colour Theory, Part 2
Understanding the Colour Theory, Part 3

Every talk about the colour theory, in some way or the other, refers to the colour wheel and the relationships of the colours depicted in it. In this article, I try to explain the various colour schemes that are commonly referenced in graphic design.

The Colour Wheel

A colour wheel can be a continuous or a well-segregated representation of the hues that are defined based on a system, such as the HSL or HSV. In most graphic design suites, the colour wheels encountered are continuous and can be used to access any colour in the RGB space. Both segmented and continuous colour wheels allow for the representation of secondary and tertiary colours.

Wherever you interact with or reference a colour wheel, you’ll notice that the hues have the same neighbours. This brings us to a commonly used harmony, analogous colours.

Analogous

Analogous colours are those that are spatially adjacent on the colour wheel. Generally, when we say that a set of colours are analogous, we reference to a set of three colours. By this harmony, blue, blue-green, and green are analogous. In modern designs, analogous colour schemes are often used for creating gradients.

Complementary Colours

Complementary colours are the colours that are absolutely opposite of each other on the colour wheel. This means that they have the highest contrast ratio, cancelling each other’s hue when mixed. Red-green and yellow-purple are some examples.

Monochromatic

Monochromatic harmony is created by variation in value, shade, or lightness of the same hue. Examples of this can be a dark red that leans towards black, and a washed out shade of red.

Split complements

Split-complementary scheme references to the relationship between a complementary and the two adjacent colours of the second complementary. This scheme is used in compositions demanding contrast that is strong, but not as strong as the complementaries. An example is the set of red-violet, yellow, and green.

Triadic and Tetradic

The triadic scheme uses three colours that are evenly spaced around the wheel, while tetradic is essentially a set of two complementary pairs.

Practicality of the colour schemes

In 2014, Google introduced the material design paradigm that has since changed the way user interfaces are designed. An important part of the whole design language is how colours are used. In essence, with other design elements, material design is an effort to standardize the way colours are used throughout a UI, in order to enhance user experience and promote accessibility.

Functionally, the monochromatic colour schemes are used to describe hierarchy, enhance text legibility. On the other hand, call-to-action buttons or key interactions are highlighted using complementary or split-complementary relations. The material design framework is a great example of the practicality of the colour theory and the various schemes defined in it.

This series of posts on “colour theory” was written to help self-taught artists, designers, and people who may commission their work, to better utilize the science behind how the human eye interpret colours and how colour interact with light, helping them move from ‘instinct’ to ‘intellect’, ultimately making and using better visual designs.