Skip to main content

Design Principles: Color

 Design Principles: Color


Color is an important aspect to any design. With all of the different colors, how does one choose a color or colors that best fit their design?! The task can seem overwhelming and quite daunting at times. However, using basic color theory, will help you intentionally choose colors that best fit your design. 


The Color Wheel

In order to use color effectively, one must first have a basic understanding of the color wheel. Primary colors consist of red, yellow, and blue. These are the basic colors that make up all other colors. Secondary colors are, you guessed it, the colors created by mixing primary colors. For example, combining blue and yellow (primary colors), will create green, a secondary color. Tertiary colors are created by mixing both primary and secondary colors. Magenta, combining red and purple, and teal, combining blue and green, are both examples of tertiary colors. 



Hue, Shades, Tint & Tone

A "hue" is the basic color. A shade is created by adding black to the "hue." Tints are created by adding white the "hue." And tones are created by combining both shades and tints together. Also known as: gray. Below are examples of hue, shades, tints and tones. 

The image demonstrates the differences between hue, tints, tones and shades. The first part of the image demonstrates "hue" through a pure, red color. The next part of the image demonstrates tints through beginning with the pure, red color and gradually ending with the color white. Tone is demonstrated next by beginning with the pure, red color and gradually moving towards the end color of gray. Lastly, Shades is demonstrated by starting with the pure, red color and gradually ending with the color black.

Image provided by Jacob Olesen on Color Meanings (https://www.color-meanings.com/shade-tint-tone-difference/)

Choosing Harmonious Color Combinations

Monochromatic: Shades, tones, and tints in the same hue.
Analagous: The three colors next to each other on the color wheel.
Complementary: Colors on the opposite of the color wheel.
Triadic: Three colors placed equally on the color wheel.
Square: Four colors equally placed on the color wheel. 
Rectangle: Tetradic color scheme, more subtle than square. 

Color Modes

Color modes determine how a picture will come across. In order to determine which color mode to use, one must first decide how the image will be viewed: online or on print. Choosing the wrong color mode may lead to unexpected color results.

RBG (Red, Blue, Green)-An additive color model designed for computer displays. The more color added, the lighter the color. (The color white is created by adding all colors together)

CMYK (Cyan, Magenta, Yellow, Key)-A subtractive color model designed to be printed with ink. The more color added, the darker the color.