WebMaster Solutions

Web Site Design

Understanding Web Color Standards

by Kenneth Catto

In 1994, Netscape defined 216 colors that have priority in browsers based on the 256 colors displayed by an 8-bit system. 40 colors display differently between PCs and MACs and are therefore eliminated.

These 216 fixed colors, known as web safe colors are universally recognized by all browsers and operating systems. This means that web pages which use only these colors have a better chance of looking the same on any browser.

Less than 5% of computer systems are currently using 8-bit systems and are thus confined to 256 colors. However, you should still use web safe colors as a starting point, especially for logos, flat color illustrations, backgrounds, and large areas of the same color in any image.

Colors are made up of 3 pairs of hexadecimal digits. Each pair represents a value from 3 root colors: red, green, and blue usually represented as RGB.

Hexadecimal is based on 16 digits not 10. So, A would be equivalent to 11, B to 12, and so on. For example, 000000 is black, FFFFFF is white and FF0000 is red. The first pair of numbers shows the amount of red, the second set shows how much green and the last set shows how much blue is used to obtain that particular color. 00 represents no amount of that color (0%) while FF is the most amount of any color you can use (100%).

Here's the percentage breakdown:
0%=00, 20%=33, 40%=66, 60%=99, 80%=CC, 100%=FF.

Web safe colors, which are made up of 3 pairs of identical hexadecimal digits, consist of every combination of 00, 33, 66, 99, CC, and FF for each root color (6 x 6 x 6 = 216).

Today's computers are no longer limited to the 256 colors displayed by 8-bit video cards. 16-bit cards display 4096 colors (referred to as web smart colors) while, 32-bit cards will display millions of different colors (referred to as unsafe colors). The total number of possible colors is over 16 million as each root color can be one of 256 values (256 x 256 x 256 = 16,777,216). Your browser can display any of these colors as long as your video card will support it.

There are many color wheels and charts available on the internet to help you choose web safe, web smart, or unsafe colors. Here are a few:

A 216 web safe color chart can be found at:
http://www.permadi.com/tutorial/websafecolor/
And also at:
http://www.techbomb.com/websafe/

4096 Color Wheel will provide the hexadecimal values for web safe, web smart, and unsafe colors along with different saturations of hues and is available at:
http;//www.ficml.org/jemimap/style/color/wheel.html

4096 Color Picker & Mixer demonstrates how different colored text appears against assorted colored backgrounds using the web smart palette. It's available at:
http://www.webcolors.freeserve.co.uk/pick4096.htm

DHTML Color Wheel provides the hexadecimal codes for all 16,777,216 colors. It's available at:
http://www.geocities.com/~prof_al/examples/colorwheel.html

Another version of the same color wheel displays your chosen color on the entire page. Find it at:
http://www.jeffchester.com/colorwheel.html

Although modern browsers will display over 16 million colors, colors other than web safe colors may not display the same on different browsers. If you choose to use colors on your web pages from the web smart or unsafe color palettes, always view your pages on different browsers. This is to make sure that the colors that look great on your browser display the same or close to the same color on other browsers.

Recommended Reading