Color Harmony

One of the most challenging aspects of visual design is developing effective color harmonies that strike a balance between monotony and overstimulation

The Color Wheel and Web Colors

One place to begin exploring balanced and engaging color relationships is a color wheel--a representation of the hues available in a color model.

Each color model contains three primary colors from which all other colors are derived. In traditional color theory, the three primary colors are blue, red, and yellow. In the RGB color model, the primary colors are red, green, and blue. Any two primary colors combine to produce a secondary color. Tertiary colors are derived from either a combination of a primary and a secondary color or from a combination of two secondary colors. We use color wheels to present all of these colors in a logically arranged sequence. As you can see from the illustrations below, an RGB color wheel differs significantly from the traditional artist's color wheel:

Traditional color wheel		RGB color wheel

Color wheels expose relationships between colors that can be used to achieve both balance and contrast. The wheels include a number of full-intensity (saturated) hues as well as a variety of tints, tones, and shades, which are less saturated versions of the hue that include more white, gray, or black, respectively. While combinations of pure hues create dynamic color harmonies, you can design more subtle and subdued harmonies by using less saturated colors that are closer in value--that is, colors with similar degrees of lightness or darkness.

Some common color harmonies include:

		Monochromatic: A single hue and a selection of tints, tones, and shades.
		Analogous: Colors that are side by side or very near each other on a color wheel.
		Complementary: Colors appearing across from one another on a color wheel. These color combinations offer the maximum amount of contrast but can be overstimulating if used extensively.
		Split-complementary: One hue plus the two colors on either side of its complement. Split-complement harmony provides less contrast than straight complements.
		Triad: Three colors that are equidistant on a color wheel.
		Tetrad: Two pairs of complementary colors.

When exploring color harmonies, it's often useful to begin with pure hues, then experiment with various tints, tones, and shades. You can then test the visual effect of a particular color combination by using a wireframe diagram. Remember that the importance of contrast doesn't end with designing for impact; it can also help or hinder readability.