Web Colors.
Home | Color pickers

Web Color Overview

Color Modes

Personal computers with CRT monitors usually offer a choice of settings for screen size and color depth. The amount of memory available to drive the display is fixed, but users can choose a large screen resolution with a reduced number of colors, or a smaller screen resolution with the maximum number of colors. The first table on the right shows the standard range of color modes. Note that 32 bit color mode doesn't increase the number of colors available, but it does allow video memory to be updated faster.

By July 2005, less than 1 percent of the internet population were using 256 color mode (see the stats).

Many people view web pages on monitors which are not calibrated to achieve optimum color reproduction. There is no easy remedy, because only a small proportion of internet users are aware of the problem or know what to do about it. Visitors to a site like this are more likely to have high specification PCs and the latest web browsers. Visit Browser News to learn more about the cautions to bear in mind when assessing browser statistics.

Color Names

The official specification for HTML 4.01, issued by the World Wide Web Consortium, includes the sixteen color names shown in the second chart on the right. Most modern browsers can interpret a total of 140 color names, which are now in the CSS3 specification. When used in HTML tags or CSS, the color names are not case sensitive.

If you are familiar with color printing processes you will recognize that the names "Aqua" and "Fuchsia" correspond to "Cyan" and "Magenta".

Web Safe Colors

Netscape's 216 web palette

The Browser Safe color system was originally devised by Netscape to provide a palette of colors which would look identical on both Macs and PCs in 8 bit color mode. Version 3 of Microsoft Internet Explorer for Windows supported all 216 colors.

The Browser Safe colors are made up of six levels of brightness for Red, Green and Blue, resulting in 216 possible colors. There are a number of alternative names for the Browser Safe color palette -- e.g. Web Palette, Netscape Palette, Web-Safe Palette, Non-dithering Palette, and the 6x6x6 Color Cube.

Internet Explorer's 212 palette

Versions 4, 5 & 6 of Microsoft Internet Explorer ( IE ) on Windows systems handle colors differently, and can only reproduce 212 Browser Safe colors in 8 bit ( 256 ) color mode. Close approximations are used for the remaining 4 colors when rendering GIF images, but they are shown darker if used in HTML tags or CSS. Note that in PNG images the four colors are 'dithered', which is explained further down the page.

This Websafe color differences chart shows Internet Explorer's substitute colors. The chart includes a 216 palette in which the four colors that appear darker in Internet Explorer are marked with circles. It isn't possible to guarantee that the 'Web Safe' color palette will look the same in every browser on every platform. It's simply a legacy from the time when Netscape 4 was the No.1 browser.

16-bit Palette - 65,536 Colors

Sixteen bit values on Microsoft Windows systems are divided into Red, Green & Blue components as shown below. The first increment from zero is a double step. Red & Blue increment in steps of 8, and Green increments in steps of 4 ( hex: 4, 8, C ). The final value is set to FF.

5 bits - 32 steps - Red
6 bits - 64 steps - Green
5 bits - 32 steps - Blue

32 x 64 x 32 = 65536

Image colors can shift in 16 bit mode, resulting in a mismatch with the background. Using transparency in GIF/PNG images is a safe solution. Alternatively, if you have image software which can edit the color palette, subtract 1 from the RGB components of the 16 bit color that needs to blend with a 16 bit background color on the page. Grays can aquire a colored tinge unless the RGB values all shift to multiples of 8.


Color modes and color names

140 color names

140 color names for 138 colors




Color dithering

Dithering and Antialiasing

Dithering:  patterns of alternating colors

When images contain colors which are not available in 8 bit or 16 bit color mode, browsers generally use an algorithm to approximate the specified colors as closely as possible. The simplest case is where pixels of two different colors are alternated to approximate the desired color, but the patterns can be more complex. This process is referred to as 'dithering'.

Software utilities for image creation and manipulation usually offer a choice of color palettes and can generate 'dither' patterns if required. Several colors can be combined in a complex pattern. If a "true color" image is created without dithering each browser has its own algorithm for approximating the colors when confined to 8 or 16 bit color mode.

Anti-aliasing:  blended pixel colors

Anti-aliasing is a method of smoothing the appearance of curved or diagonal image elements with blended pixel colors. The example below shows magnified portions of an anti-aliased image.

Unsafe Colors

In 16 bit mode, 24 bit background colors can be approximated with a 'dither' pattern, although some graphics cards simply shift the colors to the nearest 16 bit value. It's a different story if non-browser safe colors are displayed on a 256 color display. Pale colors can shift quite dramatically. The shift in vivid colors is less extreme.

The web safe color palette doesn't apply to Web TV or portable internet access devices. Choosing colors that will work on every system may seem like an insurmountable problem. And then there is the problem of color vision impairment. The safest option is to stick to these rules:

  1. Use dark text on light backgrounds.
  2. Use light text on dark backgrounds.
  3. Don't rely on differences in color to convey essential information.

Although published statistics vary, it's safe to say that close to 10 percent of internet users are likely to have some form of color vision impairment, the most common being red/green color blindness.

Multi-purpose color tool for MS Windows

Color Cop is a FREE multi-purpose color picker for web designers and programmers. Features include an eyedropper, auto-copy to clipboard and a magnifyer. Compatible with Windows 95/98/NT/2000/Me/XP.

An example of anti-aliasing.