Export (0) Print
Expand All
Expand Minimize
7 out of 11 rated this helpful - Rate this topic

Colorful Distractions

As of December 2011, this topic has been archived. As a result, it is no longer actively maintained. For more information, see Archived Content. For information, recommendations, and guidance regarding the current version of Internet Explorer, see Internet Explorer Developer Center.

Robert Hess
Microsoft Corporation

November 13, 2000

Contents

Additive vs. Subtractive Color
Color Mixing

My last few columns have dealt with various aspects of color. While I've dealt a lot with color theory, palette management, and images during my career as a programmer, I definitely don't consider myself an expert on color. To write those recent articles and provide you with the most accurate and appropriate information possible, I did some research into the relationship of colors: how they are combined, and how we perceive them. During this research, I found myself getting thoroughly confused, so I continued to dig deeper, even after I had all the information I needed for my previous articles.

My confusion primarily came from the different ways I saw people using and referencing the color wheel. Some sources would talk about the red-green-blue (RGB) primaries, others referred to the cyan-magenta-yellow (CMYK) primaries, while a third group discussed the red-yellow-blue primaries. The secondary colors of one primary group (RGB) formed the primary colors of another primary group (CMYK), while the secondary colors of the red-yellow-blue primary group were just secondary colors (purple, orange, green) and didn't represent the primary colors of any other process. This was just the tip of the iceberg.

This will probably be my final article on color, so I thought I'd touch on these issues and share with you my thoughts and observations. What follows really doesn't have anything to do with computers, or Web design, or advancements in Microsoft technologies. But it might provide some interesting reading.

Bb263958.spectrum(en-us,VS.85).jpg

We all are familiar with the color spectrum of visible light. In 1666, Sir Isaac Newton performed a number of experiments that used prisms to prove that color is a property of light. Visible light represents a small portion of the electromagnetic spectrum, which also includes frequencies that don't produce any visible light, and are better known as radio, television, microwaves, and X-rays. You can think of this electromagnetic spectrum as a drumbeat. Imagine you are in a dark room and a lone drummer, with a single drumstick, is beating out a steady beat. At the low end, the drumbeat is very slow. The drummer gradually increases the speed of the beat until suddenly the beat produces a visible color: violet. As the beat increases, the color changes to blue, green, yellow, orange, and finally red before it fades away again, leaving us with the drumbeat speeding up in a dark room.

It is easy to see in this spectrum how one color gradually blends into the next. Especially in the purple-to-blue and orange-to-red hues. As part of his experiments with color, Isaac Newton showed that when you combine two colors from this spectrum, the resulting color is located on the spectrum between the two original colors.

Bb263958.spectralcircle(en-us,VS.85).jpg

By taking this band of color and wrapping it onto the outer perimeter of a circle, you end up with what is commonly known as a color wheel, which is often used to determine the proper way to mix colors together in order arrive at a specific target color.

But wait a second. Do you notice something interesting about this spectral color wheel? Look at the top of the wheel, where the two ends of the spectrum were brought together. There is a band of black that represents where the violet on one end of the spectrum and red on the other end fade to non-visible wavelengths.

Bb263958.colorcircle(en-us,VS.85).jpg

In the color spectrum produced naturally by passing sunlight through a prism, the low end of the spectrum (violet) and the high end of the spectrum (red), never meet. In one of his experiments, Isaac Newton used two prisms to combine these two colors of light, and the result was a new color—one that was not visible anywhere in the light spectrum. That color was magenta, a bright and vibrant bluish-red hue that completes our circle of color.

Now that we have the basis for our inspection of the properties of color mixing, let's examine the various ways that colors combine. Some of this will be a bit of a review from my previous article on the color wheel, but I'm including it here for the sake of completeness.

Additive vs. Subtractive Color

To describe the behavior of colors properly, it's important to understand the difference between additive and subtractive color blending. Additive color blending occurs when colored light is being observed—either as light emanating directly from a source such as a picture tube or monitor, or as light reflected off a white surface. Subtractive color blending occurs when colored pigments are combined, then white light is reflected off of those pigments. When light hits a pigment on a surface, that surface absorbs (subtracts) some of the wavelengths of visible light, and reflects others. When you see a red surface illuminated by a white light, the surface is absorbing all other colors in the light except red, which it reflects.

Another way to describe this is that the additive process involves colored light being reflected off a white surface, while the subtractive process occurs when white light is reflected off of a colored surface. To a certain extent, you might be able to obtain the same resultant color from either process, but the method of combining primary colors to achieve that color will be different.

Red-Green-Blue

Bb263958.rgb(en-us,VS.85).gif

These are the primary colors for the additive process, and are well known to computer programmers, Web designers, and television engineers. They are the primary colors of light—and by combining pure light in these three colors, you can create virtually any other color in the spectrum—and, as Newton discovered, even a color that doesn't. When all three primary colors are combined together, you get white.

Cyan-Magenta-Yellow, plus Black

Bb263958.cmyk(en-us,VS.85).gif

These are the primary colors for the subtractive process, and they are familiar to those in the printing world. Look at any color printer, and you'll see that it uses the ink colors cyan, magenta, and yellow. By combining all three of these primary colors, you will get black. However, printers will also use a true black ink in their process as well (the "K" in CMYK; "B" was already in use for blue). There are two reasons for this. One is because the colored inks they use aren't "true" colors, and so won't quite produce a true black when combined. Also, laying down too many wet inks in one location will make the paper quite wet, which is undesirable. By adding a black ink to the process, printers can produce crisper images. Because the human eye is more sensitive to black/white variations than it is to color variations, it is important to ensure that the black/white information is as clear and accurate as possible.

Color Mixing

Look at the above illustrations. Notice how the overlapping circles create another color. Notice also that when all three circles overlap, they create either white (additive colors) or black (subtractive colors).

Take the color blue, for instance. If you add both red and green to it, you will get white. But also notice that if you combine just red and green together, you get yellow. So if you combine blue and yellow, it is the same thing as combining blue, red, and green. Thus, blue and yellow also make white. This is an important concept, and also holds true for the CMYK colors (for example, mixing cyan and red—the product of yellow and magenta—will create black). Take any color on the color wheel, add to it an equal amount of color directly opposite it, and you will get white or black.

Bb263958.blackwhite(en-us,VS.85).gif

Red-Yellow-Blue

Bb263958.ryb(en-us,VS.85).gif

Here is where things started to get a little confusing—for me, anyway. Up to this point, color theory was clean, simple, and straightforward. RGB/CMY makes a lot of sense. When I bring up my image editor, I manipulate RGB triplets to obtain the color I want. When I look at my color printer, I see ink cartridges for CMYK. However, if we think back to our grade-school days, we may remember learning that the primary colors are red, yellow, and blue, and that to get green, we needed to combine yellow and blue. Sure enough, if you grab blue and yellow crayons and smear them together on a sheet of white paper, green is exactly what you get—sort of.

Didn't I just state a few short paragraphs ago that blue and yellow would make black? (Remember, crayons function as a printing process, so we are working with subtractive colors now.) Why do they suddenly make green?

I'm not an artist, so I don't really have any experience with mixing paints. But I picked up a number of books written by artists who described their approaches to color mixing, and it became clear to me that a lot of artists struggle with this topic.

  • Color Theory Made Easy, by Jim Ames
  • Blue and Yellow Don't Make Green, by Michael Wilcox
  • Color: Right from the Start, by Hilary Page

Each of these books takes slightly different approaches to color and color mixing. They all appear to agree on the fact that color mixing is quite difficult, and that there isn't any such thing as three primary colors, from which all other colors can be obtained. However, which colors to use, and the relationship of those colors on a color wheel, differed from one author to another.

If RYB is useful only for pigment mixing, why do color printers use CMYK? Adding to the confusion, the color mixing books themselves clearly state that the three primary colors can't be used to mix any color on the color wheel. Instead, you have to have a dozen or more colors to really create the color you want.

When looking through these various books on paint color mixing, I noticed that the color often used for blue is not the bold blue you might find on the United States flag, but a blue that is both softer and brighter. The books also don't always use the shade of red that might be found in the flag, but a much livelier color. Looking closely at these colors, and comparing them to the RGB/CMYK color sets, I realized that their blue is very close to a cyan, and that their red is often identical to what I would call a magenta. In fact, in Color Theory Made Easy the author uses a CMYK color wheel to indicate how to mix paints with greater accuracy.

From this, I drew two observations. First, the best primary colors for artists will, in fact, be very close to CMYK. My second observation is that artists aren't working with a pure medium. The paint they are using is not just color; it is color being carried along as part of some physical product. Not only the acrylic, oil, or other base, but even the colorant as well is some mineral, extract, or other product that appears to be a particular color, but will always be "contaminated" by other colors to some degree.

These observations led me to return to the RGB/CMY color model, and not give much more thought to the RYB model shown in artists' books. It might work fine for them, but they are operating within some specific boundaries that apply only to their media.

The CIE Chromaticity Diagram

Before we close off and leave the world of color mixing behind us, let's take a look at one last method of denoting color. It is known as CIE, which stands for Commission Internationale de l'Éclairage. In 1931, the commission defined a color model that is based on three primaries referred to as X, Y, and Z. These aren't so much primary colors, but are more like primary functions, which can be used to represent any color in the visible spectrum. You see a representative plotting of what this looks like below. Note that the actual resultant figure is three dimensional, so this is just a slice of it.

Bb263958.cie(en-us,VS.85).gif

The black triangle (rgb) within the plot represents the approximate color gamut that can be reproduced on computer displays. (This means that the diagram displayed here is only a representation, because in a real-world implementation, anything outside of that triangle couldn't be displayed on your screen).

From the way that the CIE chromaticity diagram is designed, you can use the colors defined by any two points within the diagram to generate any color that lies directly between those two points by adding the colors together. Thus, using the colors from points r and g, you can arrive at any color along the line segment "rg"—and using the points r, g and b, you can arrive at any colors within the triangle defined by rgb. If you extrapolate that out, and look at the shape of this CIE chart, you will notice that it is impossible to define a triangle that contains the complete CIE chart and still has endpoints within the visible spectrum. This means that reproducing the entire visible spectrum is impossible to do with only three primary colors.

Artists who paint what they see attempt to reproduce the full visible spectrum of colors. We can't do that on computer monitors, nor can we do it in print, because both of those media rely on a three-color primary system. Artists, on the other hand, can use a large assortment of colors to mix, and stand a better chance at reproducing all the colors of the visible spectrum. So maybe the artists' paints suffer from contaminants in the medium (as compared with pure light), but those contaminants might provide the flexibility that allows artists to do a better job of color reproduction.

Well, that sure was a trip. When I started out, I just wanted to write a quick little article about color usage on a Web page. I had no idea I'd end up spending so much time researching this issue, or that I'd write several more articles about it. I hope we've all learned something through this process. The scary thing is that we've only scratched the surface.

Robert Hess hosts the MSDN Show.


  
Did you find this helpful?
(1500 characters remaining)
Thank you for your feedback
Show:
© 2014 Microsoft. All rights reserved.