1.3.2. Colour Contrast

We will not talk about colours in general, because there is enough literature on the Internet that deals with colour theory. We only want to introduce the seven colour contrasts as described by (1970), because colour contrast is an important aspect when designing a GUI.

• Pure Colour Contrast: Pure Colour Contrast results from the juxtaposition of saturated colours that are clearly different. This contrast is peak when the three primary colours are juxtaposed to one another. (The Voice of Color)

Pure Colour Contrast according to (Itten 1970)

• Light-Dark Contrast: A light colour next to a dark colour has a stronger effect than next to an equally light or lighter colour. The effect of hues can be intensified by greater differences in brightness. (ERCO Light Scout)

Light-Dark Contrast

• Simultaneous Contrast: This contrast demonstrates contrast by displaying how a colour looks different when placed next to other colours (Rudner). Colours change their effect due to the influence of the surrounding colours (ERCO Light Scout).

  The round dots are all exactly the same shade of gray. Clearly, the lightness of the background effects the way in which we perceive the center gray dot.
  The gray annulus appears greenish on the red background and on the green background reddish.
  The orange annulus looks brighter on the pink background than on the green background.

Simultaneous Contrast

• Complementary Contrast: The pairs of colours lying opposite in the colour wheel. Yellow-violet displays the largest light-dark contrast, orange-blue the largest cold-warm contrast. (ERCO Light Scout)

Yellow-Violet and Blue-Orange Contrast

• Warm-Cold Contrast: In the colour wheel, the warm colours with red and yellow components are located opposite to the cold blue hues. Green and magenta form the neutral transitions. The effect of a predominant colour can be increased when combined with an accent from the opposite colour (ERCO Light Scout). This combination makes warm hues appear warmer, and vice versa.

Warm-Cold Contrast according to (Itten 1970)

• Quality Contrast (or Intensity Contrast): The quality contrast describes the distinction between pure colours and murky colours. Mixing pure colours with grey shades makes the former murky and dull, and the quality of colour purity is lost. Pure colours have a dominating effect over murky colours. (ERCO Light Scout)

Quality Contrast according to (Itten 1970)

• Quantity Contrast: The quantity contrast referes to the relationship of the size of one coloured area with the next. A large coloured area with a small area in a contrast colour increases the chromatic effect of the main colour. (ERCO Light Scout)

Quantity Contrast

Special attention has to be paid on colour-blind people. People with colour deficiencies may have difficulty distinguishing certain colours (e.g. red/green; about 8% of men and 1% of women affected). There exist a few web pages where you can check your images for colorblind compatibility. Sometimes, they give advises on how to produce images which are compatible for colourblind people. An exemplary website is the one of vischeck.com.