Lynda.com


online training movie library | cd-roms | books | lynda's newsletter
resellers and volume licensing | inspiration | about lynda.com | contact | classes

 
 

the browser-safe web palette

THE WEB-SAFE COLOR DILEMMA

You might have heard of the browser-safe palette, Netscape palette, 216 palette, Web palette, and/or 6x6x6 color cube. All these terms refer to the same set of colors, which this page will describe in detail.

A lot of people credit me with the browser-safe palette, but it's a misplaced honor (if you can call it that!). I do have the distinction of being the first author to identify and publish the colors - but I can't take credit for creating them.

The browser-safe palette was developed by programmers with no design sense, I assure you. That's because a designer would have never picked these colors. Mostly, the palette contains far less light and dark colors than I wish it did, and is heavy on highly saturated colors and low on muted, tinted or toned colors.

The only reason to use the browser-safe palette is if you have a concern that your Web design work will be viewed from a 256 color (8-bit) computer system. When I published the browser-safe color chart in my first book, Designing Web Graphics, waaaayyy back in 1996, the MAJORITY of computer users had 8-bit video cards. Today, the minority have them, so the justification for using the browser-safe palette has diminished greatly if you are developing your site for users who have current computer systems.

There may be resurgence in the need for the browser-safe palette when designing for alternative online publishing devices, such as cell phones and PDAs. Those systems are still in 1-bit (black and white) or 8-bit color. Right now, very few people are designing their web sites to work on those systems, so the need for the browser-safe color palette is definitely downgraded to a mere shadow of its former glory.

So Then, Is the Browser-Safe Palette Dead?

Though this might seem blasphemous to older readers my books, or loyal website visitors, I believe it's safe to design without the palette. I believe this because so few computer users view the web in 256 colors anymore.

Keep in mind however, that many companies that hire designers and developers still feel it's a badge of Web design honor to work with these colors, so you might want to know how to use them if you have to. At this point, the palette is built into Photoshop, Paint Shop Pro, Illustrator, Freehand, Fireworks, Dreamweaver, GoLive, and just about any professional Web design/development tool, so using it is fairly easy.

Conversely, there's no harm in using the browser-safe palette either. It simply limits your choices to 216 colors. Most people don't have a lot of color picking confidence, and working with limited color choices is easier. At this point, there's no right or wrong when it comes to which colors you pick, but more important to know how to combine colors in pleasing and effective ways.

Who would have thought that computers would mature as quickly as they have? In those early days of the web, only the professional designer had a system that supported thousands or millions of colors. Today, any consumer with a Gateway or iMac is going to see all the colors you can throw their way. It's progress folks! Those of us who had to learn to design for the Web in the old days developed a skill that is fast becoming obsolete. So much for moving forward -- it's great liberation in my opinion!


What Is the Browser-Safe Palette?

For those of you unfamiliar with my books, they go into great detail about subjects which may be new to you, such as dithering, CLUTs, palettes, and 8-bit color. The palettes below are offered on the CD-ROM that comes with the book, and are available free here on the Web. Note: You do NOT have to buy, or promise to buy, my books to use these palettes. They are offered here freely with no strings attached.

The Browser-Safe Palette, as I so named it, is the actual palette that Mosaic, Netscape, and Internet Explorer use within their browsers. The palettes used by these browsers are slightly different on Macs and PCs. This palette is based on math, not beauty. I didn't and wouldn't have picked the colors in this palette, but Netscape, Mosaic, and Internet Explorer did, so....

The Browser-Safe Palette only contains 216 colors out of a possible 256. That is because the remaining 40 colors vary on Macs and PCs. By eliminating the 40 variable colors, this palette is optimized for cross-platform use.

The Browser-Safe Palette should not be used to remap color photographs. It is better to use an adaptive palette (with no dithering, if possible), and let the end-browser do any additional dithering. I have a test page which proves this point.

The Browser-Safe Palette is useful for flat-color illustrations, logos with flat-color, and areas in any image that have a lot of a single color. When a browser dithers flat colors it looks far more objectionable than when it dithers photographs. Look at this test page, which demonstrates this very point.

Since this palette was generated by math, not visual insightfulness, I hired my dear friend Joy Silverman who spent 60 hours of her life rearranging it so it might make sense to visual designers. There are two versions here: one organized by hue and one organized by value. You may copy either from these pages and distribute them freely to whomever might want to make better looking Web pages from them.

Note: These two palettes have identical colors, they are simply organized differently....


hue

[The organization by hue puts these colors in order by color]


value

[The organization by value puts these colors in order of light, middle values and darks]


Special thanks to Bruce Heavin who spent hours with me at my house, going back and forth from my Mac to my PC, trying to figure this out — and succeeding!


If you would like the CLUT or these palettes, visit my files site and download them. Note: This CLUT is only useful for flat-color style illustrations, logos, and large areas of flat color. Use it to load into the Photoshop Swatches Palette for this purpose. Do not use it to remap color photos or photographic-style images.

- Lynda Weinman

home | books | CD-ROMS | online learning library (tm) | bookstore | FAQ
links | downloads | Web color | inspiration | interviews | tips | email



Call us toll free at 1-888-335-9632
International callers: 1-805-646-7076

read our privacy statement.

Copyright 2005 lynda.com, Inc. All rights reserved.

 

1996-2005 lynda