Designing with Web-Safe Colors

If you are creating graphics from scratch, especially graphics such as logos or simple illustrations that contain areas of flat color, why not use nondithering colors right from the start? In this way, you can be certain that your graphics will look the same for all users. The major drawback to this is that with only 216 colors to choose from (a good 30 of which you’d never be caught dead using for anything), the selection is extremely limited. (See the Section 17.7 section of this chapter for one approach to overcoming the limited choice of colors.)

The trick is to have the Web Palette colors available in a Swatches palette or in whatever device your graphics program uses for making colors handy. You should be aware, however, that even if you select web colors for fills, the shades of colors created by soft drop shadows or anti-aliased edges between areas of color will probably not be web-safe.

Tools with Built-in Web Palettes

Not surprisingly, with the explosion of the Web’s popularity, the Web Palette is finding its way into many commercial graphics tools.

Adobe Photoshop 5.0

Version 5 ships with the Web Safe Colors CLUT file (see the following section) in its Color Palettes directory. These can be easily loaded into the Swatches palette by selecting Replace Swatches or Load Swatches from the Swatches pop-up menu.

Adobe ImageReady 1.0

ImageReady was created specifically for the optimization of web graphics, so it’s not surprising that the Web ...

Get Web Design in a Nutshell now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.