Colors or RGB

Colors in a computer program are represented by combining 3 "pigments". These pigments are Red, Green, and Blue (which contrasts with the "primary" colors we are used to as a child). By combining some amount of Red, some amount of Green, and some amount of Blue, any (displayable) color can be achieved.

RGB Colors

All colors on a computer are made up by combining the light from three colors (red, blue, and green). Black is [0,0,0], and White is [255, 255, 255]; Gray is any [x,x,x] where all the numbers are the same.

The max value of each of the colors is 255. The minimum value is 0.

Colors are almost always written with the Red value first, the Green value second, and the Blue value third. Memorize "RGB" and you will remember the ordering.

Here are some examples:

  1. White = [ 255, 255, 255 ]
  2. Black = [ 0, 0, 0 ]
  3. A "perfect" Blue = [0,0,255]
  4. A "prefect" Red = [255, 0, 0]
  5. A "middle" Gray = [ 122, 122, 122]

Hex Notation

For historic reasons, colors are often written in HEX which is base 16 (contrast this with decimal which is base 10). The digits in HEX are 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F (where A-F represent 10 through 15). The largest available color is FF (which means 15 * 16 + 15) or 255. The smallest available color is 00 (which means 0 * 16 + 0) or 0.

To tell the computer you are using a HEX number, you preceed the digits with the "0x" (zero x) notation.

Thus white is generally written as 0xffffff (depending on your system capitalization may or may not matter).

Notice how the HEX number for a color is the combined 3 colors for the red, green, and blue components, all run together! For example, Blue, being zero red, zero green, and 255 blue, is written as 00,00,255, all run together and written in hex as: 0x0000ff.

Examples in Hex:

  1. White = 0xffffff
  2. Black = 0x000000
  3. A "perfect" Blue = 0x0000ff
  4. A "prefect" Red = 0xff0000
  5. A "middle" Gray = 0x7a7a7a
  6. Aqua = 0x00ffff
  7. Gold = 0xffd700
  8. Indigo = 0x4b0082

Figuring out Colors

Many of the tools that we will use have builtin Color pickers. Alternatively, a quick Google search will show many color charts/pickers. Here is one possible web page. There are many more.


Back to Topics List