How do we perceive colour?

An understanding of the human visual perception system is crucial to great design. It complements more creative ways of understanding colours, such as colour meanings, the emotions they invoke and their applications to branding. Being creatives at heart, many designers’ eyes glaze over at the thought of trawling through physics and biology textbooks to unravel the mysteries of how light interacts with the human eye. Let it remain a mystery, so long as I don’t have to encounter anything measured in nanometres!

Fear not Hellenologophobes – that is, those who fear complex scientific terminology – for I have done the trawling so you don’t have to. In this article, I have included only what I deemed the most relevant information to the field of design. What follows is an easily digestible overview of how the human eye takes in information and how the brain interprets this information. It does contain wavelengths measured in nanometres, but aside from that I’ve attempted to steer clear of any jargon. So do yourself a favour and read on, so the next time you’re trying to make an element become more prominent in your purple-themed design, you will instantly know that green will do the trick.

Rods and cones

rods-and-cones

Image credit: Vision Eye Institute

There are two types of cells in our eyes that perceive light – rods and cones. Rods are sensitive to light intensity, but they cannot differentiate between different wavelengths of light. We can think of rods as seeing in black, white and shades of grey. Rods can’t distinguish the details of what we are looking at as well as cone cells can, but they do work well in low light conditions. That is why when we are in a dark room or walking around at night colours seem much duller.

For our purposes, we are mainly interested in cone cells. Cones perceive greater details than rods, are sensitive to different wavelengths of light, and provide us with colour vision, but they don’t work as well in low light as rods do. We have three different types of cone cells. Each of these cone cells is most responsive to light of different wavelengths. Together, they allow us to distinguish between different parts of the visible light spectrum and experience them as colour.

The visible light spectrum

It’s important to remember that there is no such thing as colour “out there” in the world – there is only electromagnetic radiation of different frequencies. When that radiation strikes the retina in our eye, we have a subjective experience of colour based on the wavelength or wavelengths present in the radiation.

The visible light spectrum consists of the range of electromagnetic frequencies that have a wavelength between 780 nanometers and 390 nanometers long. Our three types of cone cells are generally termed L, M, and S, for long, medium and short wavelengths. L cones are most responsive in the range 564–580 nm, M cones within 534–545 nm, and S cones within 420–440nm.

spectral-sensitivity

Image credit: Little Web Giants

Spectral colour

The spectral colours consist of all the colours we perceive when a beam of light with a single wavelength strikes our retina. When light of a particular wavelength, let’s say 580nm, strikes our eye, it causes the rods and cones to become excited, which in turn sends signals along the optic nerve to our brain, which perceives these stimuli as colour.

However, not all of our rods and cones will respond equally to light with a wavelength of 580nm. Looking at the diagram below, we can see there will be virtually no response from the S cones. The rod cells will have a small response, while both the M and L cones will have a strong response, with slightly more L cones firing than M cones. This combination of signals is interpreted by our brain as the colour yellow.

spectral-sensitivity-580nm

Image credit: Little Web Giants

Mixing two spectral colours

At this point you may have noticed that there are some problems with our colour perceptual system. For a start, we don’t have many different kinds of cone cells – other species have 4, 5 or even more. Given that the visible light spectrum can in theory be subdivided into infinitely many different wavelengths, and those wavelengths combined in infinitely many ways, how can we possibly perceive all those subtle differences with just 4 types of light sensitive cells? The answer is that we can’t.

Let’s take another look at our example using yellow light (580nm). What happens if we turn off the yellow light, and turn on a new light that has a combination of wavelengths of 573nm and 590nm? We can see that our rods and cones will have a very similar pattern of excitation in response to this new mixed light as they did to the pure 580nm beam. The brain is simply unable to differentiate between the two types of excitation and perceives the new mixed light beam as yellow.

If we now add a further wavelength of 500nm, we change the excitation pattern again. This new excitation pattern doesn’t correspond to any pattern caused by a single spectral beam, and we perceive it as a paler yellow.

spectral-sensitivity-small

Image credit: Little Web Giants

Most of the time, when we perceive colour, we are experiencing light beams containing many different wavelengths mixed together. To see pure spectral colours, you need a rainbow, a prism, or the back of a CD.

Perceived colour

From the above discussion it should be clear that the range of colours that humans can perceive is greater than the range of spectral colours.

First, we can detect some differences between pure spectral colour and multiple spectral colours combined. However, it’s good to remember that for every colour that we can perceive, there are infinitely many combinations of wavelengths that can cause us to perceive that colour.

Second, we can detect the difference between pure spectral colour and spectral colour combined with white light. True white light contains an equal mix of all frequencies within the visible spectrum. Due to the idiosyncrasies of the human colour perceptual system, light that contains a sufficient mix of wavelengths to equally excite the L, M, and S cones will be perceived as white. Adding white light to a spectral or perceived colour creates a pale or pastel shade.

Third, we can differentiate between different intensities of light. We perceive light of low intensity as darker than light of high intensity.

Finally, there is the rogue colour of the human perceptual system: purple.

The problem with purple

Let’s take another look at the visible light spectrum. It’s a nice line, from short wavelengths to long, violet to red.

Image credit: Deron Meranda

Image credit: Deron Meranda

Now let’s look at a typical artist’s colour wheel, this one from the early 20th century.

Image credit: Dr Hans Irtel

Image credit: Dr Hans Irtel

Whoa – what happened there? Our nice straight line just got joined up into a circle – and a new colour crept in to patch up the gap between spectral violet and spectral red. This little culprit is purple. There is no spectral colour – no single wavelength – that corresponds to our perceptual experience of the colour purple. It’s always created through a mix of blue and red light. Yet we perceive it as being a distinct colour in its own right. For us, it’s different from both red and blue in a way that lime is not different from either yellow or green.

I don’t know if it’s fully understood why we as humans have this extra perceptual space set aside for mixes of red and blue light. One evolutionary explanation is that our normal strategy for processing mixed wavelength light, which is roughly to perceive it as a spectral colour halfway between the two, would result in green for this particular combination. This is not particularly useful for a species dependent on foraging for its livelihood, as green foliage and purple berries or flowers probably have very different chemical compositions.

In any case, it’s simply important to know that although purple doesn’t exist as a spectral colour, it still plays an important role in our perceived colour space.

Opponent process theory

In former decades it was thought that activation signals from our rod and cones travelled directly to the brain. So high activation of the L cones would directly create a perception of “red” in our consciousness. In older texts, the L, M and S cones are even referred to as red, green and blue cones. However, we now know that the signals travelling along the optic nerve from the eye go through an additional processing step before they reach the brain.

In essence, the signals from the L, M and S cones and the rods are combined to generate 6 basic colours. In this step, colour is interpreted in an “antagonistic way” as a set of three opposites. The opposite pairs are black-white, red-green, and yellow-blue.

Image credit: Wikimedia Commons

Image credit: Wikimedia Commons

Let’s look at the black-white pair first, as it’s the easiest to understand. Imagine four streams of information, one from each of the cone cells and the rods. Each of these streams is sending a single value, between 0 and 100. These streams then get combined and fed into a neural processor. It’s helpful to think of this processor as an old fashioned needle gauge that points straight up in the neutral position and can point left or right. If each stream is sending an input of 50, then the total input will be 200 and the needle will stay pointing straight up. We will perceive a neutral grey colour.

tri-opponent

Image credit: Mondo Arc

If the inputs from the L and M cones then both increase to 75, the total input will be 250. The needle will point slightly to the right, and we will perceive a lighter shade of grey. Likewise, if total input drops below 200, the needle will point to the left, and we will perceive a darker shade of grey.

The two other opponent processors work in a similar way. The red-green processor outputs the value of the L cone excitation minus the M cone excitation. If the L cones are more activated than the M cones, the red-green processor outputs a positive value, the needle moves to the left, and we perceive red. If the situation is reversed, the needle moves right, and we perceive green.

Image credit: Dr R. G. Tonks

Image credit: Dr R. G. Tonks

The yellow-blue processor is a little more complicated. It outputs the value of the combined inputs of the L and M cones minus the S cone inputs (roughly: (L + M)/2 – S). If the L and M cones are more activated than the S cones, we perceive yellow, otherwise we perceive blue.

The inputs from the three processors are then further combined in the brain to create all the colours we perceive.

There are a few things to take away from understanding opponent process theory. First, yellow, green, red and blue can be considered the four pillars of the human perceptual colour space: our true perceptual primary colours. Second, our perceptions of yellow, blue, green and red are not directly related to pure spectral colour. In fact, light information received by the eye goes through several stages of processing before being passed to the brain. This means that the perceptual primaries are not necessarily the best colours to use as primary colours for the purposes of mixing and creating a wide range of other colours. Finally, the human brain can perceive objects as yellow or blue, green or red, but not greeny-red or yellowy-blue. Try imagining a greeny-red and you’ll have an intuitive confirmation of opponent process theory.

Optical illusions and other trickery

Once visual information arrives in our brain, it goes through a whole battery of subconscious processes before we become consciously aware of what we are seeing. These processes allow us to discard huge amounts of extraneous information, build a coherent 3D model of our environment, detect edges and object forms, and make deductions about lighting. In general, this is incredibly useful as it allows us to go about our lives without needing to consciously try and figure out where the edges of a table are, or how high up in a building we are if we look out the window.

However, as designers working with colour, there are some important aspects of this subconscious processing we need to understand, which basically all relate to the fact that the same colour can look very different depending on its context. For example, placing two contrasting colours next to each other will make them both appear more “colourful” (I’ll get to the technical terminology for this in a later post), than if they were placed next to a similar colour.

The image below shows identically coloured red squares against yellow and blue backgrounds. Set against the light yellow background, the red appears darker. Against the blue background it appears lighter and more orange. This is an example of simultaneous contrast.

Image credit: Colorcube

Image credit: Colorcube

Image credit: Todor Arnaudov

Image credit: Todor Arnaudov

Another example relates to the way the brain tries to “cancel out” effects of lighting, so we tend to perceive objects as having the colour we imagine they would reflect under even white lighting. In the following image, the central squares on the top and side of the rubix cube are the same colour, although one appears to be a vivid orange and the other a muddy brown.

Finally, white objects on a black background appear larger than dark objects on a pale background. In graphic design, this is particularly important to remember if you are using white text on a dark background, you will need to use a lighter font style than if the colours were reversed.

That was a brief overview of how humans perceive colour with a focus on its applications to graphic design. If you would like more information, check out the further reading links below.

Further Reading