Introduction to HTML
Color in HTML
Copyright © 1996 - 2002 Randy D. Ralph.  All rights reserved.
  Anchors & Links Images & Video   Course Contents  
In place May 18, 1996.   Last updated May 27, 2000.

Color
in HTML
Background
Color
Text
Color
Link
Color
<BODY>
Statements


How Colors Work in HTML:

HTML color attributes use the hexadecimal format RRGGBB for the red (R), green (G) and blue (B) color components, respectively.  Red, green and blue components are additive in nature, as shown in the color wheel to the left.  They can vary in the range from 0 (00) to 255 (FF) for a total of 256 values for each color component.  This permits 2563, or over 16 million, different colors. 

Some, mostly earlier, browsers limit the palette to a standard 6 X 6 color cube which contains only 63, or 216, colors.  Each side of the color cube allows only 6 set values for red, green and blue color components ( 00 33 66 99 CC FF ).  Colors not included in the palette are dithered to the closest match within the color cube.  Dithering reduces the number of colors by mapping color values not within the displayable palette to those which are displayable often using dot composites somewhat like pointilism or mosaics.  This can produce cartoon-like effects and step effects within suble gradations of color.  It is best to select colors from within the 216 standard colors in order to avoid such undesirable color renditions.

Similarly, some net surfers may have their microcomputers' color resolution set only to display 256 colors.  This will also collapse high graphics images using a full color palette and may also lead to unesthetic dithering effects, as well.  Those who are using 32 bit true color will see all 16 million possible color variations.  Most current microcomputers and browser applications can now handle up to 16 million colors.

Here are the hexadecimal codes for the 16 standard Windows colors:

black

#000000

gray

#808080

silver

#C0C0C0

white

#FFFFFF

red

#FF0000

maroon

#800000

yellow

#FFFF00

olive

#808000

lime

#00FF00

green

#008000

cyan (azure)

#00FFFF

teal

#008080

blue

#0000FF

navy

#000080

magenta (fuchsia)

#FF00FF

purple

#800080

Note that the table also shows the names of the standard colors.  In addition to specifying color using hexadecimal codes, which allows up to 16 million different colors, HTML permits color to be specified using one of over 240 so-called Netscape named colors.  See a table of named colors which provides both the color names and the corresponding hexadecimal color values.

Although some HTML authors will find using named colors in place of hexadecimal codes easier, it does limit the potential palette.  On the positive side, named colors dither very well so they have the advantage of producing more predictable color renditions in most browsers.


Background Color:

The color of the basic screen background and the colors of all text elements in a WWW page are controlled in HTML from within the <BODY> statement. There are several command parameters which can be applied which govern the appearance of the text and background.

The color of the basic background screen in most browsers is either a neutral gray (#808080) or white (#FFFFFF). This default for screen background color can be overridden in HTML using the command syntax:

<body bgcolor="#RRGGBB">

Where RRGGBB specifies the background color in hexadecimal format, or as a named color, as noted above.  The browser will apply the color value specified to the entire WWW page unless the user has opted to override screen and text color attributes from within the browser's options or preferences setup.


Normal Text Color:

The color of the basic text in most browsers is generally black (#000000).  This default for normal text color can be overridden in HTML using the command syntax

<body text="#RRGGBB">

Where RRGGBB specifies the text color in hexadecimal format, or as a named color, as noted above.  The browser will apply the color value specified to the all the text on the entire WWW page unless the user has opted to override text color attributes from within the browser's options or preferences setup or text color has been explicitly set using the

<font color="#RRGGBB"></font>

command.

See the discussion of specifiying font color using the <FONT> command.


Link Text Color:

The color of links in many browsers depends entirely on the settings or preferences in place.  Generally, unfollowed links are portrayed in blue (#0000FF) while followed links are portrayed in red (#FF0000).  The RGB values used for these colors can vary from browser to browser and from version to version within a single browser application.  The defaults for link text colors can be overridden in HTML using

<body link="#RRGGBB"> for unfollowed links.
<body vlink="#RRGGBB"> for previously visited links.
<body alink="#RRGGBB"> for highlighting a link as it is clicked on.

command syntax.

Where RRGGBB specifies the text color in hexadecimal format, or as named colors, as noted above.  The browser will apply the color value specified to the three styles of links on the entire WWW page.


Example Body Statements:

<body 
   bgcolor="#FFFFEE"
   text   ="#663333" 
   link   ="#805151" 
   vlink  ="#CC9966"
   alink  ="#FF0000">
Note that the command can be cascaded over several lines. This group of settings produces the background, link and text colors you see on this WWW page.
<body
   background="clouds.gif"
   text      ="#008080"
   link      ="#FFFFFF"
   vlink     ="#FFFFFF"    
   alink     ="#FF0000">
This group of settings would tile the file clouds.gif as the background with medium blue text and white followed and unfollowed links. Clicking on a link would produce a momentary change to bright red.

Color
in HTML
Background
Color
Text
Color
Link
Color
<BODY>
Statements

  Anchors & Links Images & Video   Course Contents  
You are here:  NetStrider   »   Tutorials   »   HTML   »   COLOR   «