Unlocking The Color Spectrum: A Deep Dive into the Science of Color Perception

A Deeper Look Into How Our Eyes Perceive Colors

The visible light spectrum encompasses wavelengths from approximately 380nm to 780nm, with each specific wavelength corresponding to a distinct color. These spectral colors, often depicted in series as the rainbow, are fundamental to understanding how we perceive color. Interestingly, by mixing these spectral colors, we can create entirely new colors like brown, pink, gray, magenta, and white (just to name a few).

Our modern displays, such as computer and phone screens, utilize the RGB (red, green, blue) color model to mimic these spectral colors. Each pixel on these screens combines varying intensities of red, green, and blue light to produce the wide range of colors we see. This method, known as additive color mixing, is essential in devices that emit light, including screens, lights, and projectors. We’ll discuss the biological basis for why these colors are chosen.

Here is the visible light spectrum. These are the spectral colors for each of the whole numbers in the visible light spectrum between 380nm and 780nm

All of these colors can be added (and subtracted) to create entirely different colors (brown, pink, gray, magenta & white for examples). Also, these single frequency colors of the rainbow can be created from mixing other colors. If your computer/ phone screen uses RGB, it just made each of the spectral colors by mixing red, green & blue light. We’ll discuss additive color (screens, lights, projectors) & subtractive color (ink, dyes, paints) later in this article.

Color Wheels

We’ve all seen the color wheels. Usually it is the rainbow series of colors bridged together with a magenta section gradient-bridging from red back to purple.

Note in the above rendition, Red, Green & Blue subdivide the wheel into thirds. The rainbow consists of colors known as the spectral colors, but there are many more colors possible via addition or subtraction of different colors.

In this color wheel, yellow plus these 3 primary colors (red, green & blue) evenly divide the wheel in fourths:

You’ll see these 4 colors in many logos like Google, Microsoft, eBay, older Windows logos, NBC, Google Chrome etc

All of the spectral colors can be mimicked by adding different amounts of red, green and blue together. This is actually what most of our computer monitors and phone displays do for each pixel. This next chart examines spectral colors with whole number wavelengths and then calculates how this is combined using just red, green & blue.

How We Sense Colors

The human eye perceives color through specialized photoreceptor cells called rods and cones, located in the retina. While rods are responsible for vision in low light conditions and do not contribute to color perception, cones are responsible for our ability to see colors. There are three types of cones, each sensitive to different wavelengths of light corresponding to red, green, and blue.

Red Cones (L Cones): These cones are sensitive to long wavelengths of light, roughly peaking at 564 nanometers. When red light enters the eye, it stimulates these cones more than the green or blue cones. The brain interprets the level of stimulation from the red cones, along with input from the other cones, to perceive the color red.

Green Cones (M Cones): Green cones respond best to medium wavelengths, with a peak sensitivity around 534 nanometers. When light in this wavelength range hits the retina, the green cones are most activated. The brain uses the information from these cones, in conjunction with the red and blue cones, to construct our perception of the color green.

Blue Cones (S Cones): Blue cones are sensitive to short wavelengths, peaking at approximately 420 nanometers. These cones are less numerous compared to the red and green cones, yet they play a crucial role in detecting blue light. The combined response of blue cones, along with red and green cones, helps the brain determine shades of blue and other colors.

Seeing certain colors leaves a lot of unknowns about their actual photon frequency composition. Take, for example, yellow. When we perceive yellow, it could be composed of any of these three combinations:

1. Pure yellow light: Photons with a wavelength near 575 nm.

2. Red and green light added together: A combination of red light (photons with wavelengths around 650 nm) and green light (photons with wavelengths around 530 nm).

3. Red, green, and yellow light added together: A mixture of photons with wavelengths corresponding to red, green, and yellow.

Our eyes have three types of photon-sensing cones, each tuned to different frequency ranges, which makes this possible. When it comes to the above three examples of yellow light compositions, consider how the two relevant cones perceive these:

• Pure yellow light (575 nm): The yellow light stimulates both the red and green cones to some extent, because the response curves of these cones overlap in this region.

• Red and green light added together: The red cones are stimulated by the red light, and the green cones are stimulated by the green light. When both types of cones are activated simultaneously, our brain interprets this combination as yellow, even though there is no actual yellow wavelength present.

• Red, green, and yellow light added together: In this scenario, the red and green cones are stimulated by their respective wavelengths, and the additional yellow light adds to the overall stimulation. This can create a more intense perception of yellow or a slightly different hue depending on the exact intensities and ratios of the lights involved.

This phenomenon is a result of the way our photoreceptors respond to light. Here’s how the cones work for each scenario:

1. Pure yellow light: Red cones and green cones both respond, with the green cones typically having a stronger response because their sensitivity peak is closer to 575 nm.

2. Red and green light added together: Red cones and green cones both respond, but here they each respond to their respective wavelengths. The brain averages these responses, leading to the perception of yellow.

3. Red, green, and yellow light added together: Red cones and green cones respond to the red and green components, respectively, and both respond to the yellow component. The combined response from all three types of light can enhance the perceived intensity of yellow.

Understanding these interactions can help in various applications, such as color display technology, lighting design, and even in creating visual art, where manipulating light and color can achieve desired visual effects.

So considering the photon sensors within our eyes is a must to understanding the relationships between colors and reasoning about why they affect us different.

So these 3 colors, in different amounts, can make almost any color.

Interestingly, here is how a white portion of the screen is rendered (all three RGB colors at the highest value.)

So, when we are watching a video on a screen like this, there are essentially 3 lights (a red, a green & a blue) for every pixel. So if the resolution is 1080p (1920x1080 pixels) we are taking in the light from 6,220,800 different lights that each shine one of the red, green & blue colors. Each of these 6+ million red, green or blue lights increase and decrease in intensity throughout the movie to translate the pixel data into light for our brains to decode.

Red, green, and blue aren’t just arbitrary choices; they correspond to the three types of cone cells in our eyes that are responsible for color vision. Each type of cone cell is sensitive to different wavelengths of light, allowing us to perceive a wide spectrum of colors when these primary colors are combined.

Computer Representation Of Color

One of the most common ways a computer can store a color is by using the RGB Color Space. Developers tried to strike a balance between giving lots of color options and not using up too much space. The RGB Color Space became a standard. Let’s look at an example and maybe it will ring a bell.

The RGB color #8c0797 is this shade of purple:

Each two letters of the 6 character color sequence is a number in hexadecimal (base 16) which corresponds with how much red (digits 1-2), green (digits 3-4), blue (digits 5-6). So for the color 8c0797:

Red = 8c = 140 (of max 255)

Green = 07 = 7 (of max 255)

Blue = 97 = 151 (of max 255)

It only takes 24 bits to store an RGB color in this scheme, and it yields 16,777,216 colors to choose from.

RGB & The Human Eye

The human eye perceives color through three types of cone cells, each sensitive to different wavelengths of light:

1. Short wavelength (S-cones): These cones are sensitive to short wavelengths, around 445 nm (673,690,916.9 MHz), and are typically associated with detecting the color blue.

2. Medium wavelength (M-cones): These cones are sensitive to medium wavelengths, around 540 nm (555,171,218.5 MHz), and are typically associated with detecting the color green.

3. Long wavelength (L-cones): These cones are sensitive to long wavelengths, around 565 nm (530,606,120 MHz), and are typically associated with detecting the color red.

When comparing these wavelengths:

• The long wavelength (565 nm) is 27% longer than the short wavelength (445 nm).

• The long wavelength is 4.6% longer than the medium wavelength (540 nm).

Let’s think back to our shared experience of RGB screens and the spectral (rainbow) colors. What’s interesting is blue is the lowest frequency of the 3 RGB colors that comprise our monitors, with an approximate wavelength of 445 nm, yet our monitors can mix red and blue light in equal amounts to approximate even lower wavelength colors like purple.

So how does red (445 nm) + blue (565 nm) = 380nm?

When red (approximately 700 nm) and blue (445 nm) light mix, they do not create a wavelength directly between them, such as 572.5 nm, which would be somewhere in the green spectrum. Instead, the combination of red and blue light produces magenta. This is because additive color mixing works differently from subtractive color mixing. In additive mixing, our brains interpret the combination of different wavelengths as entirely new colors rather than intermediate wavelengths.

What’s particularly interesting is the difference in how our brains perceive combinations of different colors. When red and green light are combined, the resulting color (yellow) is interpreted as a wavelength between the two original wavelengths. However, when red and blue light are combined, the resulting color (magenta) is more extreme and does not correspond to a simple intermediate wavelength. This is not an exception but a general characteristic of additive color mixing. Our visual system processes the combined wavelengths as distinct colors, not as a blend of their wavelengths. This happens across various combinations of colors, not just with red and blue.

Understanding this can be confusing because it doesn’t follow straightforward arithmetic. The process is about how our eyes and brains interpret the mix of different light frequencies. By combining different intensities of red, green, and blue light, screens can reproduce a wide range of colors that our eyes perceive as a seamless spectrum.

White

White is an interesting perceived color. A common definition for white is the combination of “all the colors in the rainbow.” But is this really true? Again, our monitors can create a color we perceive as white using three spectral colors: red, blue & green.

An interesting tool for our exploration of color is the Spectroscope which shows us the composition of light. Here’s one I bought for $10

This device allows you to look through a scope and aim it at a light source, revealing a color spectrum. The different portions of the spectrum glow brighter or darker depending on the frequencies of light present.

When I used the spectroscope to examine the light emitted by my monitor and phone (an iPhone), I observed that they produce white light by emitting red, green, and blue light. The gaps in the spectral distribution of this white light are evident when compared to a traditional lightbulb, which illuminates the spectrum in a much more continuous and even manner- although with many of the lights I tried their composition lacked many colors in the rainbow spectrum.

Therefor it is clear that our brains perceive white when exposed to a sufficient mix of frequencies across the visible spectrum. It seems that when too many frequencies are combined, our brain runs out of distinct ways to process them individually, resulting in the perception of white. One could say it’s almost a malfunction of our minds. We simply run out of colors the represent whatt or retinas’ cones are detecting. This is why I avoid using white backgrounds for content I publish or consume.

RGB Color Mixing Results

• Red (Low frequency, approximately 700 nm) + Blue (High frequency, approximately 445 nm) = Magenta

  • This mix creates a color that is perceived as magenta, a hue that does not correspond to a single wavelength but is instead a combination of red and blue light.

• Green (Medium frequency, approximately 540 nm) + Blue (High frequency, approximately 445 nm) = Cyan

  • The mix of green and blue light produces cyan, another color that is a combination of the two wavelengths and not a single specific wavelength.

• Red (Low frequency, approximately 700 nm) + Green (Medium frequency, approximately 540 nm) = Yellow

  • Combining red and green light yields yellow, a color that our eyes perceive as being between the two original wavelengths.

• Red (Low frequency, approximately 700 nm) + Green (Medium frequency, approximately 540 nm) + Blue (High frequency, approximately 445 nm) = White

  • When red, green, and blue light are mixed in equal intensities, the result is white light, which contains all wavelengths of the visible spectrum combined.

Additional Examples:

• Red (Low frequency, approximately 700 nm) + Cyan (Medium-high frequency, mix of green and blue light) = White

  • Since cyan itself is a combination of green and blue light, adding red to it completes the RGB spectrum, resulting in white light.

• Green (Medium frequency, approximately 540 nm) + Magenta (Combination of red and blue light) = White

  • Magenta, being a mix of red and blue, combines with green to form white light, as all primary colors are present.

• Blue (High frequency, approximately 445 nm) + Yellow (Combination of red and green light) = White

  • Yellow, as a mix of red and green, combines with blue to produce white light, again because all primary colors are combined.

Additive vs Subtractive Light & Colors

What we’ve been discussing so far is light and what happens when light of different frequencies is added together

The simplest equation for additive color is to use the RGB color model and do the addition separately for each of the color components. Using color hex format, where each red, green, and blue level is stored as 2 digits base-16 numbers from 0 to 255, where the light emitted is calibrated such that when R=255, G=255 & B=255 hits white. In other words 255=100%. (The 255 is for historical reasons- economy of storage space led software developers to use 8 bits to represent each RGB color level)

So the equation(s) for adding two colors:

• New Red level = The lesser of (R1 + R2) and 255

• New Blue level = The lesser of (B1 + B2) and 255

• New Green level = The lesser of (G1 + G2) and 255

In other words the component RGB color levels are summed with red, green and blue levels each capped at 255, aka 100%. This corresponds directly with the types of photon detecting cones in our retinas: which are aligned with these three colors.

Color Subtraction: How Printers Paint Many Colors With Magenta, Cyan, Yellow

While screens use additive color mixing with red, green, and blue light, printers and painters use subtractive color mixing to create a wide range of colors on paper. Subtractive color mixing involves the absorption and reflection of light. When light hits a colored surface, some wavelengths are absorbed (subtracted), and the remaining wavelengths are reflected back to our eyes, producing the color we perceive.

The Subtractive Primary Colors

• Cyan: Absorbs red light and reflects green and blue light.

• Magenta: Absorbs green light and reflects red and blue light.

• Yellow: Absorbs blue light and reflects red and green light.

By combining these three primary colors of the subtractive color model, printers can produce a wide variety of colors. Here’s how it works:

Basic Color Combinations

• Cyan + Magenta = Blue

  • Cyan absorbs red light, and magenta absorbs green light, leaving only blue light to be reflected.

• Cyan + Yellow = Green

  • Cyan absorbs red light, and yellow absorbs blue light, leaving only green light to be reflected.

• Magenta + Yellow = Red

  • Magenta absorbs green light, and yellow absorbs blue light, leaving only red light to be reflected.

Creating Black and Full Spectrum

• Cyan + Magenta + Yellow = Black (or dark brown)

  • Ideally, combining all three subtractive primary colors should absorb all wavelengths, resulting in black. However, due to imperfections in ink and paper, the result is often a dark brown. Printers add black ink (denoted as 'K' in CMYK) to achieve true black and enhance shadow details.

Another example of subtractive color mixing is stage lights with colored filters on them. However, when these lights shine on the stage and are combined with each other that is additive color mixing.