Web Page Design

26 July 2000

Color Basics

To specify colors in Web pages, you can refer to the predefined set of colors by name. For more control, though, you have to use a six-digit hexadecimal code, specifying the mix of red, green, and blue (RGB) in each color. (Here's a handy hex-to-decimal conversion chart, if ever you need one.)

Think of each color code as three sets of two hexadecimal digits: the first two for red, the second two for green, the last two for blue. Any of these three can be assigned a value from 00 to FF (hex for 255), meaning you have a theoretical limit of 256 x 256 x 256 colors, or 16.7 million -- more than the human eye can distinguish. For practical technical reasons (i.e., not all monitors can show them), it's best to stick to numbers like 00, 11, 22, . . . EE, FF. That still gives you 16 x 16 x 16 colors, or 4096. (It's better still if you stick to 00, 33, 66, 99, CC, and FF.) Some samples:

Code	Sample
#000000
#FF0000
#00FF00
#0000FF
#FFFF00
#FF00FF
#00FFFF
#FFFFFF

Your colors don't all have to be 00 or FF: you can use different numbers between them to get different shades. The lower the numbers, the closer to black.

Code	Sample
#FFFFFF
#DDDDDD
#AAAAAA
#888888
#444444
#000000
#0000FF
#0000DD
#0000BB
#000088
#000066
#000044
#000022
#FF8888
#CC8844
#77AA22

Someone has collected a palette of the 216 most reliable colors to use on Web pages.

You can put the color tags in several places:

<body bgcolor="#FFFFFF"> (inside the <head> section of your document) will give you a white background for your whole page.
<font color="#FF0000"> (anywhere in the document) will give you red text.
Inside a table, you can put <body bgcolor="#0000FF"> inside a cell to make that cell's background blue.
With other codes inside an anchor, you can change the colors of links -- but let's hold off on that; it's usually best to stick with the default blue for links and purple for unfollowed links.