- Understanding Color
- Using Color
- Color Models
- Color in the .NET Framework
This chapter is from the book
This chapter is from the book
This chapter is from the book
Color Models
Color is a very slippery thing to quantify, but of course we must quantify it if we are to work in the digital world. There are three different models in common usage, and we'll examine each in this section. But ultimately, all three models are derived from the physics of color, and so we'll begin our examination of color models with a little (very little) of that.
Additive and Subtractive Color
You've probably seen the results of shining light through a prism—the white light is split into its component colors, the spectrum. You may recall that what's happening here is that each color has a different wave length.
All color is a function of the way our eyes perceive different wave lengths of light. When you look at a hyacinth, you see it as white because the petals reflect all wave lengths of light back to you. You see the leaves as green because they absorb all wave lengths except those our eyes perceive as green. Pigments work exactly the same way—titanium white reflects all wave lengths, while lamp black absorbs them.
Technically, pigments are never pure in the sense that physicists use the term. Titanium white reflects almost all wave lengths of light, but not all of them. If you doubt this, just walk into the nearest paint store. There are dozens of whites, each of which absorbs a slightly different range of wave lengths. But the model is close enough for our purposes.
Now, the important thing to understand here is that if you're looking at anything that doesn't actually glow, its color is determined by the color that's absorbed. Yellow crocus absorbs all the red, green, and blue wave lengths. Purple iris absorbs the red, yellow, blue, and green.
When you combine colors in the form of paint or pigment, you're not so much adding colors together as subtracting them. Blue and yellow make green because the blue absorbs some of the yellow, the yellow absorbs some of the blue, they both absorb red, and what's left over is green.
I do understand that this particular bit of knowledge is singularly unhelpful when you're up to your elbows in finger paint. But it does explain why the color mixtures that are represented on the traditional color wheel are called the subtractive model.
The inverse of the subtractive model is the additive model. While the subtractive model explains what happens when you combine things that don't emit light, the additive model explains the interaction of light of various wave lengths—the combination of colored light. Combining colored light is, of course, precisely what you're doing when you specify color on a computer screen.
I suppose because the ability to combine colored light is fairly new, most color theory is based on the subtractive model, and that's what we've been examining so far in this chapter. The additive model has a different color wheel, as shown in Figure 4-8 in the color insert.
)
Figure 4-8 The Additive Color Wheel
Use the subtractive color wheel for designing color schemes.
The primary colors on the additive color wheel are red, green, and blue rather than red, yellow, and blue. Red and green, for example, combine to make yellow. (I don't think I shall ever get used to that.)
Notice that the relationships between colors aren't the same on the additive color wheel. Yellow and blue are directly opposite each other on the wheel, but they aren't complements, and they don't behave the same way in relationship to one another. When you're working out color schemes, work from the subtractive color wheel.
HSB Color
Hue, saturation, and value are the dimensions used when we talk and think about color. The additive and subtractive models, and the color wheels that represent them, are used when we physically manipulate color. The HSB color model sits somewhere between the two.
The HSB model specifies color as a combination of three values: hue, saturation, and brightness. Hue and saturation correspond directly to the hue and saturation of color theory, while brightness corresponds roughly to value. The difference between brightness and value is the difference between the additive and subtractive models—a lack of light isn't so much black as, well, dark.
In the HSB model, hue is measured as degrees on the color wheel, with pure red being both 0 and 360 degrees
Saturation and brightness are both measured as percentages in the HSB model. For example, a saturation value of 0 is white, while 100 is the fully saturated color.
As we'll see, the .NET Framework provides only limited support for the HSB model, and in fact it is not as widely used as the next two models.
CMYK Color
The color model most often used for printing is CMYK, which stands for Cyan-Magenta-Yellow-blacK. (I think the K is to avoid confusion between the "b" in black and the one in blue, but I wouldn't swear to that.)
All four values in the CMYK are expressed as percentages, which translate directly to the percentage of the corresponding color ink required to reproduce the color in the four-color printing process.
Because of its importance in the printing process, the CMYK model is widely supported in drawing and publishing software, but surprisingly, isn't supported by the .NET Framework.
RGB and ARGB Color
The final common color model is RGB, which represents the additive primaries Red, Green, and Blue. This is the standard model used for specifying color for computers.
The .NET Framework adds an additional value to red, green, and blue: the alpha value. The alpha value specifies the transparency of the color, the extent to which the color is blended with its background. Like the other values in the RGB model, alpha values are specified as an integer between 0 (transparent) and 255 (fully opaque).
NOTE
By convention, ARGB values are specified in hexadecimal, making the range 0x00 to 0xFF.
When the alpha value is less than 0x00, the actual color of each pixel is determined by the following formula:
displayColor = sourceColor × alpha / 255 + backgroundColor × (255 – alpha) / 255
Fortunately, GDI+ takes care of the calculations for you. You need only specify the alpha value. (It's easiest to think of alpha as a percentage value, although that does require a little arithmetic translation to arrive at the hex value.)
There's an ARGB exerciser included in the sample code of this chapter, so you can play with alpha values to get a feel for them.