facebook twitter
Webucator's Free Color Theory Tutorial

Lesson: Color Theory Principles

Welcome to our free Color Theory tutorial. This tutorial is based on Webucator's Color Theory course.

Using hues and a few simple rules associated with each, color principles can be applied to ensure the proper color scheme is being used. Although these very basic rules exist, that does not mean we have to limit our creativity and never deviate from the rules. However, a thorough understanding can give you the skills to make informed decisions about using colors.

The world is made up of many regions, and the individual groups that live in each region have distinct patterns and heritage that affects their perspective and view of life. Each of these cultures has a different understanding of the hues and their meaning to that culture. This is important to understand because a color's implication can drastically change the way we approach and use the color principles in a project.

Lesson Goals

  • Learn to recognize various color principles.
  • Learn to use the impact of each color principle to convey the proper tone for your project.

Complementary Colors

Any color that is chosen opposite of one another on the color wheel is considered a complementary color.Complementary Color Wheel

These colors are often described in comparison with one another as high contrast, high energy (especially when they involve a primary color). These must be used sparingly as a "pop" of color or as an accent for dramatic purpose. If overused, the end user can be left feeling overwhelmed and uneasy.

Physical spaces, such as walls, should also incorporate a few neutrals along with the complementary palette in order to make it appealing on an everyday level.Room Done in Neutrals and Complementary Colors2013 Tracy Berry


Contrasting as a term simply defines "difference", and when applied to color, difference of hue. These are great ways to easily draw attention to one thing or another by making the hue very different. So, for example, if we have a neutral beige wall with very neutral beige tone art on that wall, and we introduce a bright, vivid red toned art piece, that art piece will be the first one people see. This is because our human eyes love contrasts and are drawn to them.

Contrast exist in more than just our color world. It also exists in shapes, texture, and even our sense of taste. That one-in-a-million type experience could be considered a form of contrast in our memory.

However you use contrast, less is more. Keep it simple to ensure the effect will be very dramatic and purposeful.Fish on Tarp2013 Tracy Berry


Vibrancy is a term that means many things in many settings. To color, vibrancy is a lively, bright, rich, energetic hue. The use of vibrant colors in a project also extend that feeling. Keep the tone of your project in context with the colors you choose.

Vibrant colors on a monitor are even more vivid as colors on a monitor are mixed with light, lending even more vibrancy than usual.

Vibrant colors in the physical world are often harder to mix and use and often should be used in pure states. This means that we do not overmix them, thereby, dulling them down.Business Exterior Done in Vibrant Colors2013 Tracy Berry


Monochromatic is a term often used to describe something very blended, with not a lot of hue variety. The sensation this leaves one with can be soothing and calming, yet if we use bright hues, the sensation can be intense as well.

Monochromatic colors schemes are used to create a minimal, yet impactful design that will draw attention to key areas. The base color choice will define the sensation we leave the audience with.

Vibrant Monochromatic:Vibrant Monochromatic Shellfish2013 Tracy Berry

Dull Monochromatic:Dull Monochromatic Hooks2013 Tracy Berry

The guiding principles of monochromatic color use is that they are somewhat "foolproof" as each color you use is guaranteed to match because they are all shades of tints of the same base color. Monochromatic colors are a safe way to apply color, and this can be one way to make sure that the content is the star of the project and that the design doesn't detract from the content. Keep in mind though that monochromatic colors do tend to have a boring connotation and therefore are not always a popular choice.

Keep in mind based on the scope and purpose of the project, a safe approach is not always a bad thing. Keep it all in context and use that as your guiding principle.

Work with Color Principles

Duration: 15 to 25 minutes.

In this exercise, you will change the tone of a project by applying various color principles.

  1. Open C:\ClassFiles\color-principles\Exercises\logos.ai or C:\ClassFiles\color-principles\Exercises\logos.psd.
  2. Edit each logo to make the feeling and tone of the logo very different. No right or wrong answers, just explore.


  1. Open C:\ClassFiles\color-principles\Exercises\logos.psd.
  2. Edit the images to make them opposite of the current tone.
    1. In Photoshop, make sure the Swatches panel is active (Windows > Swatches) and that the logos layer is active.Swatches Panel and Layers
    2. Use the Paint Bucket Tool Icon Paint Bucket Tool to apply colors to parts of the logos.
  3. Your results may look like the ones below.
  4. BeforeOriginal Logos
  5. AfterAltered Logos