The Browser Safe Palette

Learn more at

Most computers today are capable of displaying up to 17 million different colors simultaneously. But back when video RAM was scarce, a method was devised that would permit the monitor to display pictures acceptably using only 256 different colors. Each image file contained a list or palette of the specific colors needed to display the picture. Some of the 256 possible colors were reserved by the system for use in displaying components such as title bars etc., so only 216 colors were available for the image.

A Web browser must be capable of displaying several images together on the computer screen, each using a different palette. To solve this problem, Web browsers use a color lookup table with a fixed set of colors. If an image uses a color not in the browsers color table, the browser can substitute with the closest match, or use a color mixing scheme called dithering. This might cause unexpected results in the appearance of the picture.

If you want to accommodate users with older palette based display systems, your GIF images should use only colors contained in the browsers fixed palette. This set of colors is called the browser-safe or Web-safe palette. To view the colors in the browser safe palette in a popup windows

Colors are specified with three hexadecimal values from 00 to ff (0 to 255 in decimal) to use for the intensity of the red, green, and blue components of the color. For example if you wanted to specify a background color for your Web page you might enter bgcolor="#cc66ff". To view the code for the JavaScript program I used to generate the color table

Newer computer monitors can displaying up to 17 million different colors simultaneously, but if you want your images to appear in the proper colors on older displays, you need to use colors selected from the browser safe palette.

Learn more at

More Graphics Design Tips:
• Create GIF Animations With Free GIMP Image Editing Program
• Inkscape Document Properties
• Inkscape Layers and Z-Order
• Building an Image with a Logo
• Image Processing Filters - How to Sharpen a Photograph
• How to Really Create an Arc in SVG
• Create Animated Glistening Gold Text With SVG
• XDdom 3D Axis and Coordinate System
• Where To Find Free Stock Photography, Clip Art, And Other Graphics For Your Web Site
• What is Blender? The Software's Origins and Evolution