- The Color Wheel
- The RGB Color Space
- Web-Safe Colors (a Color Cube)
- Choosing Colors
- Summary
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Web-Safe Colors (a Color Cube)
When the Web was first widely deployed, many computers were not able to display more than 256 colors at a time. This was sufficient for what most people had used their computers for up to that time. Hardware that would display more colors with reasonable performance was still prohibitively expensive for the casual user.
The makers of the original browser (called Mosaic, the predecessor to Netscape Navigator and the common ancestor of all modern graphical browsers) were faced with an interesting problem: Design a palette of equal-spaced colors to be used as a lowest common denominator for systems limited to 256 colors. The palette they came up with has 216 colors and came to be known as the Web-safe color cube. (216 is 6 cubed; a cube has six sides; a color wheel has six colors; Get it?)
Of course, there are many ways to represent the Web-safe color cube, and by the very nature of a cube there is no one right way. In fact, in many representations, you would need to show slices of the cube's interior to fully represent it visually. With that in mind, Figure 3 shows a representation of a color cube organized by primary and secondary colors in the corners (with black and white in the 7th and 8th corners). This is a popular representation of the color cube, but it's worth noting that it is missing some possible colors.
){kind=link}
Figure 3-The six sides of one possible organization of a color cube.
It is useful to look at the color cube from different perspectives. Try putting "color cube" in a Web search engine, you'll find a lot of different views.
For those of us who are mathematically inclined (and that likely includes you, as a programmer), it is often easier to look at the color cube from the perspective of the numerical values involved.
Remember that the colors are described by the value of each color component, Red, Green, and Blue, on a scale of 0 to FF (hex). If you divide that space into six equally spaced values, you get 00, 33, 66, 99, CC, and FF. Table 2 shows each value as a percentage, in decimal, and in hexadecimal.
Table 2-The Web-Safe Color Values
|
Percentage |
Decimal |
Hexadecimal |
|
0 % |
0 |
00 |
|
20 % |
51 |
33 |
|
40 % |
102 |
66 |
|
60 % |
153 |
99 |
|
80 % |
204 |
CC |
|
100 % |
255 |
FF |
For example, CC9933 (204, 153, 51) is a Web-safe color (a warm brownish color). Conversely, D5A131 (213, 161, 49) is not. The Web-safe color cube was created using these six equal-spaced values for each component in the RGB color space. Think of it as an equal-tempered scale of colors, much like the twelve-tone scale in music.
Today, most computers can display at least 65,536 different colors on their screens. Unfortunately, many of those users have hardware that slows down with a great number of colors, and still others are using older computers that are limited to 256 colors. With that in mind, it's a good idea to stick to the 216 Web-safe colors as much as you can.