Learn to Spot Clashing Colors Used in Graphic Design

Here's a Good Example of Opposites That Attract

Learn How to Use a Color Wheel
Dimitri Otis / Getty Images

Contrasting colors or complementary colors are opposite each other on the color wheel. Using colors that clash is not a bad combination in print design. They are high-contrast, high-visibility pairings that demand attention wherever they are used.

In color theory, contrasting colors are exactly opposite from each other on the color wheel. In design, the terms complementary and clashing are applied more loosely than in the strict color theory sense. Colors within a small range on the opposite side of the color wheel—usually the color on each side of the color directly opposite—are also considered opposites, not just a specific color pair. Call it artistic license.

Clashing colors can work together in a design depending on the amount of color and how close they appear together on the page or screen. Designs with too much clashing color, too close together may appear to vibrate and overwhelm the viewer.

Contrast: One of the Principles of Design

Contrast is one of the basic principles of design because contrast tends to draw the eye to an important element of a web page or print design creating a focus of attention. Contrast isn't limited to contrasting colors; it exists in line widths, textures, color intensity, shapes, font sizes, and other elements, too.

Which Colors Clash?

Common color combinations that use two or three contrasting colors are described as complementary, split-complementary, and triadic color schemes.

  • Complementary: The two-color complementary combination usually uses two high-contrast or clashing colors that are opposite on the color wheel. Examples of complementary colors include red paired with green, blue paired with yellow, and orange paired with purple. Complementary colors are high contrast and high energy.
  • Split-complementary: The split-complementary color scheme uses two colors that are near neighbors and one that is opposite those two, such as red, orange and light blue.
  • Triad: A triad scheme uses three colors that are equally spaced on the color wheel, such as purple, lime green, and orange.

Using any of these contrasting color schemes in a design draws attention if you use them properly. You don't have to use them at full-color strength. Using a lighter or darker shade of a color or a version that is less saturated may work better for you in a design, but the colors still add contrast.

The Importance of Color Contrast

Color is one of the most important elements of many designs. It keeps the viewer's interest, draws the eye, and makes elements stand out. Choose your colors carefully.

Steer clear of some color combinations where text is involved. Making anything difficult to read on a print piece or web page is contrary to what you are trying to accomplish. For example, 8 percent of men have some form of color blindness, and red and green color blindness is the most common form of male color blindness. If your web page is aimed at men, using red and green as text and background colors could cost you a significant chunk of your targeted viewers right out of the gate.