Web Safe Colors

If you have been doing web design for a few years, you probably remember web-safe colors. This used to be a hot issue with many web designers who were dedicated to the user of only web-safe colors. These days the issue of web-safe colors is more or less gone, but I am keeping this page here to give some information for those of you who might not have even heard of web-sage colors before.

What are web-safe colors?

Back in the early days of the internet there was a reason to be concerned about consistency in how browsers displayed the colors. Many computer screens back then had 8-bit color displays, which could only display 256 different colors. The computer system itself uses some 40 colors, for menus and such, and the remaining 216 colors could be used to display the actual web pages.
Now, 216 colors might sound like quite a bit, but the problem is that no aesthetic considerations were made when these colors were decided, but rather they are based solely on mathematical formulas. To be more exact, the web-safe colors are what you get when you use 0%, 20%, 40%, 60%, 80% and 100% of the three different primary colors, and then mix these in every possible combination.

Below are all the websafe colors, along with their hexadecimal values.

So, should you use web-safe colors?

The proportion of web users with a screen capable of displaying only 256 colors decreases by the day, and today they are virtually non-existant. A page which uses non-web-safe colors is not rendered unreadable, even on these old screens. These sayd you safely deviate from the web-safe colors without needing to feel guilty.

Color Display

One issue to keep in mind are displays that uses 16-bit 'high color' display. These screens are not capable of producing as many colors as a 'true color' display. High color displays are gettign pretty rare as well, but some hand-held devices still uses 16-bit displays. The problem with High Colors usually arises when you mix colors that are defined in an image and colors which are defined in the HTML code. Then, even if the colors are supposed to be the same, they are displayed differently in the browser. If you have your screen set to High Color you have probably noticed these little discrepancies when you surf the web. To get around this problem, you can use small, one-colored images for backgrounds. Also, try to make the background transparent on your gifs, or us png's, even if they are displayed on a background which is supposed to be of the same color.