The RGB color system displays a colored image within an electronic system, such as a television, computer, or any digital image, before printing. It is a complex system. However, knowing the basics is good if you are a digital artist or web designer.
In this additive color method, red, Green, and Blue (RGB) are added together in various amounts to produce a wide array of colors.
Each color is described by the strength of the Red, Green, or Blue components. These values specify the intensity of the colors with three numerical values for each, from 0 (none) to 255 (full intensity).
Within RGB, possible decimal notations include: Red is equal to 255, 0, 0 (Red at full intensity, no Green or Blue); Green is equal to 0, 255, 0 (Green at full intensity, no Red or Blue); and Blue is equal to 0, 0, 255 (Blue at full intensity, no Red or Green).
Decoding RGB |
When Red is equal to (255, 0, 0), this means Red at full intensity with no Green or Blue. Green is equal to (0, 255, 0). This means Green at full intensity with no Red or Blue, etc.
Creating Colors with RGB Values |
Red Value |
Green Value |
Blue Value |
Red | 255 | 0 | 0 |
Green | 0 | 255 | 0 |
Blue | 0 | 0 | 255 |
Maroon | 153 | 0 | 0 |
Yellow | 255 | 255 | 0 |
Gray | 153 | 153 | 153 |
RGB Value | 0 | 17 | 34 | 51 | 68 | 85 | 102 | 119 | 136 | 153 | 170 | 187 | 204 | 221 | 238 | 255 |
Red | ||||||||||||||||
Green | ||||||||||||||||
Blue |
Converting RGB Numbers to Web Colors
Web colors are usually specified using hexadecimal notation, not RGB decimal notation. The hexadecimal system is an alphanumeric base-16 system. F is the highest value, and 0 is the lowest value. The whole counting range is 0 1 2 3 4 5 6 7 8 9 A B C D E F.
Hexadecimal Number System:0 1 2 3 4 5 6 7 8 9 A B C D E F
Color is coded by the strength of the RGB system's Red, Green, and Blue components. The HTML hex color value template is 'RRGGBB.' RR is the Red intensity, GG is the Green intensity, and BB is the Blue intensity. A combination of six hexadecimal digits displays the digital translation, where the hex values for each color can range from a high of FF to a low of 00.
For example, FF9900 is the hexadecimal code for orange (255, 153, 0) in RGB notation. The first two digits represent the amount of Red. The following two digits represent Green. The last two digits represent Blue.
On a 256-color monitor, only the R of Red, the G of Green, and the B of Blue affect the color, except for pure colors and grays, where only 6 of the hex digits have any effect. Those digits are F, C, 9, 6, 3, and 0. The most practical two digits are FF, CC, 99, 66, 33, and 00. We could also use F0, C7, 95, 61, 3A, 0E instead of FF, CC, 99, 66, 33, 00 and get the same results on a 256-color monitor, but it might be slightly different on higher resolution monitors.
There are millions of combinations of colors within these six alphanumeric digits, but only 216 of these colors can be safely displayed by every browser. The 216 web-safe colors are always a combination of the following values:
Hex | 00 | 33 | 66 | 99 | CC | FF |
RBG | 0 | 51 | 102 | 153 | 204 | 255 |
The Browser Safe Color Palette
Web-safe colors are the set of 216 colors standard to most browsers. A palette created from such colors is often called a web-safe or browser-safe palette because it produces consistent results on different platforms and browsers. When an image is displayed in a 256-color screen mode, this set of colors is never dithered.
If a designated color is not included in the default palette, the browser will choose two colors to closely replicate it. This substitution of color is called "dithering." That is why specific images may look speckled or grainy. Text will not be "dithered" but displayed in the palette using the following color closest to it.
Sponsored by the Art Verve Academy. Enroll in studio art classes for adults in Tucson, Arizona, at ArtVerveAcademy.com. |