R. Craig Collins >Common > How To: Colors

How To: Colors © R. Craig Collins, 2005,7

How computers mix color
Color Chart

If you zoom in on a digital image, you would see something like the image to the left... a series of dots. The most simple image might be black and white dots... to tell the computer how to save this, you might just say white=1 and black=0.

Now think of a box of crayons, maybe then white=7, red=6, magenta=5, yellow=4, green=3, turquoise=2, blue=1, and black=0.

So numbers can represent colors. The more shades you want, the larger the number would be for each dot.

But better than 8 colors would be about 200 colors, or 65,000 colors. But in modern digital images, color is about mixing wavelengths of light to form millions of colors. When discussing color and computers, you normally are discussing combining various values, or intensities, of: red, green, and blue. A computer monitor typically creates the colors you see with thousands and thousands of pixels, or picture elements. These tiny glowing points of light that cover your screen consist of three tiny points, one that controls the intensity or red, one for green, and one for blue. For each dot or pixel you see on a screen, a series of 1s and 0s is being feed to the computer, indicating the values to be fed to the red, green, and blue pixel components. When you mix these pixel parts, your eyes see different colors.

Normally, to get about 16 million colors, this would be sent to the computer as twenty four 1s and 0s
eight 1s and 0s for red,
eight 1s and 0s for green, and
eight 1s and 0s for blue.

Something like

While not a problem for computers, all of these numbers get quite out of hand for people, so the three color octets are normally represented with their hexadecimal equivalents, which range from 00-FF, or 256 possibilities per primary color. (See numbers for an explanation on hex.)

And again, these primary colors are combined to generate the 16 million odd shades, and on the Internet are represented with the three hex values for red, green, and blue in sequence, such as bgcolor="#ff0000" to color the background a bright red. (Think full red, no green, and no blue)

Again, there are three components involved: Red Green Blue.
In binary, it is

In hex, it would be

Below is a table viewable only with HTML 3.2 or better browsers, such as Internet Explorer 3.0+.

The format is: <tag color="#then the color contained in the box">

Color Charts

Our 8 crayon box colors, in hex :)

NOTE: THE COLOR SETTINGS OF YOUR MONITOR MAY AFFECT HOW WELL THE COLOR IS PRESENTED ON YOUR MONITOR... BEYOND THAT THESE COLORS WILL LOOK THE SAME ON MOST SYSTEMS.

The 216 'universal' colors that work on most monitors
(using only combinations using 00, 33, 66, 99, CC, and FF for the red, green, and blue components.)