26 March 1997
The yellowy color in the background of this frame is specified in the HTML as #FFFF99. This, of course, is the popular RGB color-encoding scheme, easily understood by computer and HTML freaks the world over1. In the above representation, each color component is expressed as a two-digit hexidecimal number. A more readable representation might be (255, 255, 153), which means the red value is 255 (all the way on), blue is 255, and green is 153. All black would be (0, 0, 0), and pure red would be (255, 0, 0).
RGB is the most obvious way to represent color on a computer. Why? Because that's how a monitor works.
RGB is common on computers because the software uses it to tell the hardware how to paint a color. The electron gun needs to know how brightly to light up each dot within a pixel. This brightness is represented in 8 bits, which gives 256 brightness values for each color, for a total palette of exactly 16,777,216 colors.
So RGB was chosen because it directly corresponds to the medium. In other mediums, different color-encoding schemes have been used. For example, in paper printing, something known as CMYK is used. The C stands for cyan, the M for magenta, and the Y for yellow. K is for black; I suppose because they thought B would look like Blue. CMYK is a subtractive color system, because you start out with white, the color of the paper. If you want to print green, you mix cyan and yellow2.
Years of using RGB has made it second-nature to me, but many people find it cumbersome. An alternate color encoding, HSV, is based on the more readily understood concepts of tint, shade and tone. Three-dimensionally, think of HSV as a cone. H, or hue, is a number between 0 and 360 -- the angle around the vertical axis. Value, V, is a number between 0 and 1 -- the distance from tip to base of the cone. S is shade -- the distance from the center line. Because of the conic shape, brightness values near 0 have less shade information.
(Note- if you are viewing this in a low-color environment, the HSV circle might look funky, and you won't get the most out of this)
Notice that V is only as strong as the strongest component of RGB.
While RGB is the best format for encoding graphics for computers, it is not the most efficient. Many bits are wasted in the lower brightness levels. The human eye has a tough time distinguishing (0, 0, 22) from (0, 0, 21) or any of the other low-brightness colors, though they are given equal importance to bright red under RGB. An encoding system very similar to RGB is YIQ, which is used on your television set. YIQ is simply RGB re-encoded for transmission efficiency and compatibility with black-and-white television signals. The way it works is fairly simple: Since your eye is most sensitive to brightness, that gets the most bits of encoding. Only the brightness, Y, is picked up by black-and-white televisions. I and Q get significantly fewer bits, and are used only in color televisions.
Computer file formats also require efficient encoding. If this can save a few bits for each pixel, it can significantly reduce the overall size of the image. There are quite a few ways to do this, and JPEG files use one of them: YCbCr. This scheme is closely related to YIQ, with the Cb and Cr rotated about the Y axis3.
The JPEG format (JFIF4) can save significant space because typical digitized photographs have areas of similar brightness. The file format specifies a brightness for a 64-pixel area with one value, then uses a few bits to adjust the luminance up or down from this value for each pixel. This bit of trickery normally is great, but it fails to encode simply colored items like this single line.
On the left is a simple red line, saved as a gif. On the right, the same image has been re-saved as a jpg.
As you can see, JPEG makes some assumptions about what is important and what isn't, and it assigns bits accordingly. The extra information gets thrown away, and there is no way to get it back when the image is decompressed. Once you know what is assumed, it is easy to construct a lot of examples like this.
So next time you use color in a computer program, remember: RGB isn't the only kid on the block, just the first one. There are as many ways to encode color as there are colors themselves. If you would like more information, I recommend reading Poynton's Colour FAQ.
-- Ray <email@example.com> is a Dreamer of Dreams at go2net. If you told him he was gullible, he'd probably believe you.
Source code to the applet.
"You Can! with Geekman" is a parody of You Can with beakman