Tuesday, 15 January 2013


Colour and Contrast 

There are three different colour modes;  

  • RGB (screen based media, additive colour system)
  • CYM ( Printed media, subtractive colour system)
  • RYB (used when mixing paint)

In the our second colour theory session we were introduced to Johannes Itten's seven contrasts. 

Due to how our eyes perceive colour they can be tricked into seeing the full range of visible colors, through the adjustment of just three colors: red, green and blue.

Itten's Seven Contrasts 

  • Contrast of tone.
  • Contrast of hue.
  • Contrast of saturation. 
  • Contrast of extension.
  • Contrast of temperature.
  • Complimentary contrast. 
  • Simultaneous contrast. 

Contrast of Tone.

Formed by the juxtaposition of light and dark values. This could be monochromatic (single colour). If you remove the chromatic value the tonal value can be defined more easily.


Below are two examples, they show the phrase 'word' rendered in white and black against a neutral grey background, both are readable and have the same tonal qualities as grey is a mid-tone between the colours. When a darker tone of grey is introduced there is less contrast, therefore it blends with the background making it less legible.

Moreover, when we change the colours the same rules apply. Below, the first example shows two colours, red a primary colour and orange, a secondary colour that is created when red and yellow are mixed. As these colours have a similar chromatic value there is not much tonal contrast which makes the phrase less legible. If we change the colour and use a strong blue, there is a stronger contrast between the phrase and background making it more legible. Moreover, the background red is also affected, as the contrast in tones changes how we perceive the colour. As there is a strong tonal difference, the background red is perceived as darker than it actually is.

Contrast of Hue.

Formed by the juxtaposing of different hues. The greater the distance between hues on a colour wheel, the greater the contrast. Therefore, complimentary colours have the greatest contrast of hue.


Below is an example where blue yellow and red rectangles have been placed on a page and separated by white lines.  The three primary colours shown have a high hue contrast as they are far away from each other on the colour wheel. The white surrounding the colours weakens the appearance of yellow, the stronger colours such as red and blue seem more intense. Moreover, when a black background is added yellow stands out the most.

Contrast of Saturation

Formed by the juxtaposition of light and dark values and their relative saturations.


Below is an example of saturation contrast. The first image shows the base colour, which is a dull blue. On top of this, a stronger more intense blue has been placed. As the new layer of blue is more intense  than the base, it makes the first initial layer look duller.  

Moreover, the second two images show the process being repeated, a more intense, stronger blue is added each time, the outer colour is perceived as more and more dull.

Contrast of Extension

Formed by assigning proportional field sizes in relation to the visual weight of a colour. Also known as the contrast of proportion.


The contrast of extension is essentially the balancing of colour, examples of which can be seen below. In the first image three quarters of yellow has been mixed with one quarter of violet, in this case the colour is unbalanced and overpowering. However, when these measurements are reversed the amount of violet balances out the harshness of the yellow.  

Moreover, in the next example we can see the full effects of contrast of extension. It is harsh to focus on the bars of violet colour due to the unbalanced amount of colour. 

Contrast of Temperature

formed by juxtaposing hues that can be considered ‘warm’ or ‘cool’. Also known as the contrast of warm and cool


The warmest colour is red-orange and the coolest colour is blue-green.The group of colours between yellow and red-violet are called warm colours, and from yellow-geen to violet are considered cold. The image below shows a progression of colour going from red through to blue. While the black lines are separating the colours they look solid. 

However, when you remove the black lines each colour looks like it has a gradient, it is clearer to see where the colours join. 

Complimentary Contrast

Formed by juxtaposing complementary colours from a colour wheel or perceptual opposites.


Complimentary colours such as red and green, or blue and orange have the harshest complimentary contrast as they are directly opposite each other on the Itten's colour wheel.  

Simultaneous Contrast

Formed when boundaries between colours perceptually vibrate. 


Simultaneous contrast is most intense when the two colours are complementary colours, when placed next to each other the lines seem to blur and the colours mix. This is because the colours change our perception when placed next together.

Moreover, colours will always want their complementary colour with them, when placed on a grey background blue tints the lines it touches with orange, yellow tints the lines violet and red, green.


After learning about Itten's seven contrasts we were set a task. We first found partners to work with and then selected ten coloured objects collected for last weeks task. The ten objects were divided into two different colours, we chose blue and orange. We then placed each object on different coloured card to see how our perception of the colour changed, there were five different colours of card; yellow, red, orange, green and blue. Moreover, we had to select the highest, middle and lowest contrast for each object.

Orange box - Yellow
The box shows a contrast of tone, as orange is a tertiary colour to yellow, as the chromatic value of the two colours is similar the orange loses chromatic value and looks less intense. 

Orange bag - Yellow

Orange straw - Yellow

Orange pepper - Yellow

Blue container - Yellow

Blue plastic bag - Yellow

Blue box - Yellow

Light blue box - Yellow

Blue wristband - Yellow

Orange pepper - Red
Medium contrast - Similar chromatic value.

Orange box - Red

Orange soap container - Red

Orange plastic bag - Red

Orange straw - Red

Blue wristband - Red

Blue plastic bag - Red

Light blue box - Red

Blue container - Red

Blue box - Red

Orange soap container - Orange

Orange box - Orange
Lowest contrast - Same chromatic value. 

Orange pepper - Orange

Orange straw - Orange

Orange plastic bag - Orange

Blue wristband - Orange

Blue container - Orange

Blue plastic bag - Orange

Blue box - Orange 
Highest contrast - The blue box creates the highest contrast as it is a strong blue which contrasts the orange, blues complimentary colour.

Light blue box - Orange

Orange soap container - Green 
Highest contrast - Orange has a similar chromatic value to red, which is the complementary colour to green, this creates a high contrast between the colours.

Orange Pepper - Green

Orange box - Green
Highest orange contrast - complimentary colours

Orange straw - Green

Orange plastic bag - Green

Blue band - Green

Blue container - Green
Middle contrast - The colours have a similar chromatic value and are tertiary colours.  

Light blue box - Green
Lowest contrast - The light blue box has a similar chromatic value to green and therefore creates the leaste contrast.

Blue box - Green

Blue bag - Green

Orange soap container - Blue 

Orange pepper - Blue

Orange box - Blue

Orange straw - Blue 

Orange plastic bag - Blue
Highest contrast - Orange plastic bag, as blue and orange are complimentary colours they create the highest contrast when placed next to each other. 

Blue container - Blue 
Lowest contrast - Blue container 

Blue wristband - Blue

Blue plastic bag - Blue
Medium contrast - Blue plastic bag. The paper and plastic bag have a similar chromatic value. moreover, we can see an example of contrast of saturation, as the bag has a stronger chromatic value we perceive the paper duller. 

Blue box - Blue

Light blue box - Blue

Subjective Colour

Below we have two complimentary colours, yellow and violet. Yellow is the brightest colour of the two which attracts your eyes to the letters, making the word legible. 

However, if we reverse the colours it becomes much harder to read, as our eyes are attracted to the yellow negative space.  

No comments:

Post a Comment