In the post on color theory, What Everybody Ought to Know About Colors, we discussed in detail how colors vary by type, how they work together, and how colors fit very well on what we know as the color wheel.

In this segment, you’ll realize the importance of color knowledge in your graphic and web design sphere. Most of what is discussed below is used in Photoshop color management and image manipulation schemas.

The Basics of Color Theory

Hue

When you look at an object that has color, you ask “What color is that?” Colors come from various wavelengths of light and hue is what defines each unique wavelength. In other words, hue represents different colors. We can have hues of red, orange, green, yellow, blue, and violet.  The ‘H’ in the diagram below represents all of the various hues in the visible color spectrum.

Saturation

You’ll notice in the above diagram there is another variable represented by an ‘S’. This is also known as the saturation. Most of you probably get an idea what saturation does. If you’ve played around in Photoshop, you can saturate or desaturate an image based on your preferences. Referring to the diagram above, when you change an images saturation, you’re also changing the diameter of the hue which is what causes the image to go from full color to grayscale.

Value

The ‘V’ represented in the diagram above tells how much of Red, Green, and Blue to use in the color. In other words, value is also the brightness of color. Values 255,255,255 will create the color white (#FFFFFF). The combination of Hue, Saturation, and Value make up the HSV model used to create a three-dimensional view of color.

Luminosity

Luminosity is also known as how bright a color is.

How it Works in Design

The following diagram shows you how Photoshop and other digital software allow you to use what we’ve just covered:

You see above that we have all the parts we’ve discussed: Hue, Saturation, Luminosity. Photoshop even allows you to create color based on whether you prefer the HSB(V), RGB, or the CMYK models.

In part II of this lesson, we will cover Chroma, Tint, Colorfulness, Shade, Intensity, and other color manipulation techniques.

Popularity: 91% [?]