Hexadecimal Colors

To specify colors on the Web you must enter the pound sign # followed by the 6 character hexadecimal code. Here are some examples:

#000000 #00CC00 #CC0000

#FFFFFF #FF9900 #CC0099

#0000CC #FFCC00 #990000

#FF0000 #FF6633 #00FFFF

#FFFF00 #666666 #99CC00

Using HTML and hexadecimal color codes, you can specify

background color
text color of the whole page
text color of some selected text
text color of links, viewed links and active links
background color of table or table cell

Color is an attribute: Body Attributes

You can specify a background color for your HTML page, as well as text color, link color (the color of your links before they have been clicked), viewed link color (the color of your link after it's page has been viewed) and active link color (the color of your link while the link is clicked down.)

These colors are put into your HTML page as an attribute of the body tag.

This will make a green page with white text, navy blue links that turn dark grey after being viewed, and yellow while the link is pressed.

See an example of this page.

Changing Text Color

Using the above body attributes to specify color will change all of the links and text color on your whole page. What if you just want one line or one part of your text to be a different color?

Color is an attribute that can also be specified inside the font tag. Notice how the font tag is applied to each letter here. Even though all of the text is size +7, the color of each letter changes, therefore the font tag has to start and end after each letter, and be re-applied for the next.

U


S


A

USA

Web Safe Colors

Both Macs and PCs have 256 colors in their system palettes, but only 216 of them are the same colors. These 216 colors can be viewed the same on all computers. These are called "browser safe colors" or "Web safe colors."

Just because a color is expressed in a hexadecimal code, this does not mean the color is Web-safe.

It's easy to recognize a web-safe color in HTML code because all Web safe colors are a combination of 00, 33, 66, 99, CC, and FF

Web-Safe

#009900

#990000

#6633CC

#FFFF99

NOT Web-Safe

#358613

#8D0C1F

#5B43BC

#FAF59E

(See Niederst chapter 12 for more on how colors work)

Hexadecimal Colors and RGB Colors

Web images are created using a RGB (red green blue) palette, as opposed to CMYK (cyan magenta yellow black) that is used for print.

Make sure you are working in RGB color mode. In Photoshop go to Image-->Mode and select RGB color.

In Photoshop, you can select color by clicking the color box at the bottom of the toolbar (circled on left). When you do, the color picker (below) pops up.

Notice the box on the bottom that says Only Web Colors. Make sure this box is checked.

Notice the R, G, and B values that are inside the red box? These 3 numbers are the "recipe" that mixes a specific amount of red, green, and blue in order to produce a color. The number at the bottom, #3333CC is the hexadecimal value for this RGB color.

It is important to know the RGB value as well as the hexadecimal code for the color if you have to match colors on your Web page to specific colors in your graphics.

Once you decide on colors, be consistent! Use these codes to guarentee that you always use the same exact color.

Web Color Resources

Use this Browser Safe Color Chart from Lynda Weinman.

Browser Safe Colors, organized by hue. These are the 216 colors which will always look the same on any browser. RGB code and Hexadecimal code is listed.

Hexidecimal Color Codes and Samples A long table illustrating every color, the corresponding hexadecimal code and the name of the color. Does not give RGB values.

Web Master's Color Lab