top of page
  • Alicia Elliott

Inclusive design for colour blindness

How we use colour to visually communicate information more inclusively.


We use colour continuously to communicate information. 1 in 12 men and 1 in 200 women have colour vision deficiency (colour blindness) that creates a challenge to their everyday tasks. When creating life science visuals, a common technique is using colour to communicate and create hierarchical information. Let's understand what colour blindness is and discuss effective inclusive design practices to help improve visual communication for people with colour blindness.

How do we see colour?


To understand colour blindness, we need to know how we see colour.

  • Light is electromagnetic radiation in the form of energy wavelengths. The sun emits wavelengths of energy, and the human eye visually perceives only the colour wavelengths, and each colour has a wavelength measurement. Light travels with all of these wavelengths mixed as white light. The colour wavelength ranges are an approximation since there are no clear boundaries between one colour and another along the spectrum.

The sun emits wavelengths of energy, and the human eye only sees the colour lightwaves, also known as the visible spectrum. The visible spectrum lightwaves combine to form white light. The illustration's right side shows the wavelength measurements of visible light. The colour ranges are an approximation since there are no clear boundaries between one colour and another along the spectrum. Violet – 380–450 nm Indigo – 450–485 nm Blue – 485–500 nm Green – 500–565 nm Yellow – 565–590 nm Orange – 590–625 nm Red – 625–750 nm
© Alicia Elliott

  • When white light hits an object, the wavelengths that make up the colour of that surface bounce back into our eye (the other wavelengths not reflected are absorbed into the object as heat).

The green surface reflects the electromagnetic wavelengths of 500–565 nanometers into the eye, and the rest of the visible wavelengths absorb into the object as heat.
© Alicia Elliott

  • Special cells in our eyes, called cones, are sensitive to different colour wavelengths. These 'colour signals' (along with shape, location, etc.) travel via our optic nerve to the brain's visual cortex, where the different signals are analyzed to form a mental image.

1. Reflected visible light wavelengths enter the eye through the cornea and pupil.  2. The lens focuses light on the retina located at the back of the eye. 3. Photoreceptor cone cells responsible for colour vision absorb light and convert it to an electrical signal. 4. The electrical signals containing the colour data pass through the optic nerve to the brain's visual cortex. 5. The brain processes the electrical signals to see and perceive shape, colour and movement correctly.
© Alicia Elliott


 

Red, blue and green light. How the eye decodes wavelengths into colour.


So, we have covered how visible colours have their own wavelengths. The eye sees reflected wavelengths off of a surface, and the photoreceptors in the eye convert that wavelength into their own data signal to send to the brain. There are three photoreceptor cone cells in the retina responsible for colour vision. Each carries one of three photopigments (red, green, blue) that react differently to coloured light, sending signals to our brain that result in our colour vision. All of the colours we see are a mixture of red, green and blue light.


There are three photoreceptor cone cells in the retina, and each carries one of three photopigments (red, green, blue) that react differently to coloured light, sending signals to our brain that result in our colour vision. All of the colours we see are a mixture of red, green and blue light. Blue sensitive cones detect short length waves 380–550 nm (peaking at 450 nm). Green sensitive cones detect medium length waves 430–670 nm (peaking at 550 nm). Red sensitive cones detect long waves 500–750 nm (peaking at 600 nm).
© Alicia Elliott

TRICHROMACY

Considered to be normal colour vision. People have all three functioning cone types:

  • Red (L = long wavelength)

  • Green (M = medium wavelength)

  • Blue (S = short wavelength)

Blue sensitive cones detect short length waves 380–550 nm (peaking at 450 nm). Green sensitive cones detect medium length waves 430–670 nm (peaking at 550 nm). Red sensitive cones detect long waves 500–750 nm (peaking at 600 nm).
© Alicia Elliott

What is colour blindness (CVD)?


Colour blindness is when you are unable to distinguish colours and shades normally. Complete colour blindness is rare, so the more accurate term to describe most cases is colour vision deficiency (CVD).


DICHROMACY AND ANOMALOUS TRICHROMACY

  • Dichromacy– One type of photoreceptor (cone cell) is missing, and a person cannot see the wavelengths for that type. Only two of three cone cells perceive colour.

  • Anomalous trichromacy– All three photoreceptors (cones) are present. One cone cell is malfunctioning, causing a reduced ability to see the colour wavelengths in the section of the colour spectrum for that photoreceptor. Those colours appear muted.


 

Types of colour blindness


PROTAN (RED DEFICIENCIES) COLOUR BLINDNESS

  • Protanopia (dichromacy) occurs when Red (L) cone cells are missing, and long colour wavelengths cannot be seen.

  • Protanomaly (anomalous trichromacy) occurs when all three cone types are present, but the Red (L) type malfunctions.

Protanopia (dichromacy) is caused when Red (L) photoreceptors are missing and only short, and medium colour wavelengths can be seen.  Protanomaly (anomalous trichromacy) occurs when all three cone types are present, but the Red (L) type is malfunctioning.
© Alicia Elliott

Protanopes are more likely to confuse the following colours:

  • Black and red

  • Dark brown with dark green, dark orange and dark red

  • Some blues with some reds, purples and dark pinks

  • Mid-greens with some oranges



DEUTERAN (GREEN DEFICIENCIES) COLOUR BLINDNESS

  • Deuteranopia (dichromacy) occurs when Green (M) cone cells are missing, and medium colour wavelengths cannot be seen.

  • Deuteranomaly (anomalous trichromacy) occurs when all three cone types are present, but the Green (M) type malfunctions.

Deuteranopia (dichromacy) is caused when Green (M) photoreceptors are missing and medium colour wavelengths cannot be seen. Deuteranomaly (anomalous trichromacy) occurs when all three cone types are present, but the Green (M) type is malfunctioning.
© Alicia Elliott

Deuteranopes are more likely to confuse the following colours:

  • Mid-reds with mid-greens

  • Blue-greens with grey and mid-pinks

  • Bright greens with yellows

  • Pale pinks with light grey

  • Mid-reds with mid-brown

  • Light blues with lilac



BLUE/YELLOW (BLUE DEFICIENCIES) COLOUR BLINDNESS

  • Tritanopia (dichromacy) occurs when Blue (S) cone cells are missing, and short colour wavelengths cannot be seen.

  • Tritanomaly (anomalous trichromacy) occurs when all three cone types are present, but the Blue (S) type malfunctions.

Tritanopia (dichromacy) is caused when Blue (S) photoreceptors are missing and only medium and long colour wavelengths can be seen.  Tritanomaly (anomalous trichromacy) occurs when all three cone types are present,  but the Blue (S) type is malfunctioning.
© Alicia Elliott

Tritanopes are more likely to confuse the following colours:

  • Light blues with greys

  • Dark purples with black

  • Blues and oranges with reds


 

Inclusive design for colour blindness


When creating content that will reside on a screen, there are a few things that you need to consider to address the issue of colour blindness. Here are some helpful tips to keep in mind.

  • For non-decorative images, avoid using colour alone to convey information. Add labels and legends.

  • Use high contrast between colours because people with colour blindness can still differentiate between light and dark

  • For graphs and pie charts, use colour blind safe palettes and include shapes, patterns and textures to differentiate information

Top Illustration: A person with Protanopia colour blindness will have a difficult time distinguishing Item 2 from Item 3. Bottom Illustration: A person with Protanopia colour blindness can now differentiate the pie graph sections after the addition of patterns and outlines.
© Alicia Elliott

  • Avoid the following colour combinations:

Colour combinations to avoid for a colour blind friendly palette. Green and Red, Green and Brown, Blue and Purple, Green and Blue, Light Green and Yellow, Blue and Grey, Green and Grey, Green and Black
© Alicia Elliott

Here are some great colour simulators to ensure that your visuals are colour blind friendly:


 

Glossary


Visible light waves– Electromagnetic radiation wavelengths measuring from 390–750 nm are visible to the human eye. This visual spectrum is divided into seven colours: violet, indigo, blue, green, yellow, orange and red.


White light– Is colourless light that contains all of the wavelengths of the visible spectrum.


Cone cells– Photoreceptor cells that are responsible for colour vision in the retina. There are three types of cone cells: Blue sensitive cones detect short-length waves 380–550 nm. Green sensitive cones detect medium-length waves 430–670 nm. Red sensitive cones detect long waves 500–750 nm.


Trichromacy– Considered to be normal colour vision. People have all three functioning cone types.


Dichromacy– One type of photoreceptor (cone cell) is missing, and a person cannot see the wavelengths for that type of cone cell. Only two of three cone cells are used to perceive colour.


Anomalous trichromacy– All three photoreceptors (cone cells) are present. One is malfunctioning, causing a reduced ability to see the colour wavelengths in the section of the colour spectrum for that photoreceptor.


Protanopia/Protanomaly– is caused when Red (L) photoreceptors are missing or malfunctioning and long colour wavelengths cannot be seen or are muted.


Deuteranopia/Deuteranomaly– is caused when Green (M) photoreceptors are missing or malfunctioning and medium colour wavelengths cannot be seen or appear muted.


Tritanopia/Tritanomaly– is caused when Blue (S) photoreceptors are missing or malfunctioning and short colour wavelengths cannot be seen or appear muted.


84 views0 comments

Recent Posts

See All
bottom of page