Web Safe Colors

Anyone who has done any sort of web page has probably heard of the web-safe colors. Web-safe color is a bit of a debated issue among web desingers these days. Many firmly believe in using only these colors, while others feel they can allow themselves to use colors which are not regarded as safe.

What are web-safe colors?
Web-safe colors are somewhat of a remainder from the early years of the web, back when a normal screen could only display 256 colors. Back then, there was a reason to be concerned about consistency in how browsers displayed the 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 web-safe 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. At the moment, less than 1% still use these old screens. A page which uses non-web-safe colors is not rendered unreadable, even on these old screens, though admittedly some colors can differ in a rather ugly way. Still, I'd say that you can deviate from the web-safe colors without needing to feel guilty. After all, what is the purpose in getting a color to display the same way on all screens if it is a color that you don't really like anyway, and don't feel very enthusiastic about? However, if you are using a color which is close to a web-safe alternative, you might as well make it web safe, to ensure that it will be displayed properly.
It has also been shown that only a small part of the web-safe colors are truly safe, which is another reason not to bother with them.

Color Display

However, there are more things you need to keep in mind about how colors are displayed. At present, about 95% of all users have screens with True Color. On these screens, the colors are displayed just the way you want them to be. However, about 5% all web users have screens which displays High Color. High Color is somewhere in between the old standard 256 colors and the True Color millions of colors. 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, even if they are displayed on a background which is supposed to be of the same color.