Colors and HTML

When working with HTML you will probably use colors quite a bit, whether you want to specify a background color for your document or different colors for the text. All colors are derived from mixing various shades of Red, Green and Blue (or RGB), the three primary colors. (Yes, red, green, and blue. Remember, we're working with light, not paint.) With Windows, each of the three primary colors has 256 shades, which when combined can produce over 16 million different colors (256 x 256 x 256). When choosing colors for use with your Web page, a lot of graphics programs will give you the decimal amount of red, green and blue used to create a particular color. Decimal means the value for each will be between 0 and 255 (computer systems like to start counting from 0). HTML however doesn't use the decimal system for defining colors, that would be too easy. HTML uses hexadecimal format, or HEX, to define colors. The decimal system is a base-10 system, meaning numbers can range from 0 to 9. Hexadecimal is base-16, or 0 to 15. Because the numbers still only use one space, the numbers 10 thru 15 are represented by the letters A through F. So 15 in Hex is the letter F.

When using HEX to define colors, there are still only 256 shades for each RGB, so a maximum number in hex would be FF. Some quick math would tell you that 16 x 16 = 256. When defining a color in HTML, you simply use the hex value for red, green and blue. For example, white is comprised of maximum RGB, so if you want a white background on your web page, the attribute would look like: bgcolor="#FFFFFF". Black would be all zeros (#000000). Although it's considered optional, it's standard practice to preface any hex number with the # sign. This is just an indicator that what follows is a number, even though it might contain letters. To find out how to convert decimal to hexadecimal, see the professor.

Try It !

Below are three boxes, representing Red, Green and Blue. Try entering different values for each to see how the background color is affected. Remember that Hex always uses two places, so 2 would be written as 02 and that 10 through 15 are A through F. The values of FF are the maximum numbers allowed for each.

This is what the body tag would look like:

BACK Table of Contents NEXT