Working with a Web Color Chart

The 216 element "safe" web color chart can be a little discouraging to most web designers. A few years ago, 216 colors covered most of the available spectrum, but now with thousands or millions to choose from it seems like an unnecessary limitation to many designers. Of course, it's ultimately a choice for the designer, but with web-enabled 256 color mobile devices working from a web color chart is coming back into style.

There are plenty of web color chart resources. You can find web sites that list colors along with their hex codes and names, laminated charts you can hang on your wall, and software with built in color palettes. Finding a web color chart is the easy part, choosing a color scheme based on that chart is the challenging part.

Web color charts often group colors together by hue, by shade, or according to some other method. They leave it to the designer to select a pleasing color combination suitable to their target market. In order to select a good color scheme, it's important to keep the following tips in mind.

A light background with dark text is easy on the eyes. If your visitors find your content difficult or painful to read, they will probably go elsewhere. You don't have to stick to just black and white though. Black text on a pale blue background can be visually appealing. If your web color chart displays colors grouped by saturation, choosing a pale background color will be easier, as well as a darker text color.

Use bright colors to draw attention. When you have decided on a color palette, choose a highly saturated color to mark important parts of your website like new or updated content. A bright red or yellow will quickly attract the eye, but use it sparingly since those colors can be visually overwhelming.

Keep it simple. Too many colors can create a confused and disjointed look. Using your color chart, pick out a background color, a foreground color, a main color for links and headlines, and a highly saturated color for important areas. Try to stick close to these colors to maintain continuity on your site. For instance, choose similar shades for hyper links, with a brighter color marking an active link and a darker color showing one that has been previously visited.

Working with a web color chart can help you put together successful color schemes quickly. Deciding what kind of chart (or charts) works best for you is important. You may want to have multiple charts available, with colors organized by different criteria, to help make your selection faster. For instance you may want one chart where the elements are shown by saturation to help you quickly decide on a pale, dark, or bright color and another chart where colors are shown by hue to help you select several shades of blue that work well together.

A good web color chart is an essential tool in designing attractive sites. Even if you choose to work with colors that aren't featured on a typical web color chart, you can still develop rough ideas for possible color schemes quickly. If a portion of your visitors use mobile devices such as cell phones or PDAs, designing with a "safe" color chart is a must.

top