Introduction To The RGB Color System

The RGB color system works on the basic principle that each color is a composition of red, green and blue. Colors are created by adding more light to a starting color of black, and for this reason it is also known as the Additive Color System. Every color in the RGB spectrum is made up of a different value for each of its red, green and blue components.

Each of the red, green and blue components are represented by a number in the range 0 to 255. Web designers are more familiar with the hexadecimal format of these values, ranging from 00 through to FF. 00 is the lowest amount of the color present, FF is the highest. Using the hexadecimal value for black as an example, the following image demonstrates which part of the hex value represents red, which part represents green and which part represents blue.

Try to think about the RGB color system as a white canvas in a dark room with a red, green and blue flashlight shining on it. This is depicted in the image below.

Referring to the diagram on the left:

  · When all 'flashlights' are off, it is black (K). That means that all color values are zero, giving a value of #000000.

  · When all colors are shining onto the canvas, they produce white (W). All 'flashlights' are on full, giving a hex color value of #FFFFFF.

  · Red: #FF0000

  · Green: #00FF00

  · Blue: #0000FF

  · Cyan (blue and green): #00FFFF

  · Magenta (red and blue): #FF00FF

  · Yellow (red and green): #FFFF00





Navigate this article:
Intro | 1 | 2 | 3 | 4