Color: The Basics

by Taylor Slattery | December 24, 2019

Color - The Basics

We’re taught about color from a young age. It’s all around us. It has strong cultural and emotional connotations and can be used to communicate in ways that words struggle to. But how well do we really understand it? As children, we approach color with reckless abandon. We let our intuition guide us. We express ourselves without restraint. As adults, when we begin to study design and are introduced to color theory, our relationship with color changes. It becomes academic and can feel serious. We worry if we’re making the right choices and begin to look to those with more experience for the answers. When things aren’t clicking, it can be quite stressful.

The good news is, you’re already an expert. You’ve been using color all of your life. As creatives, our voice is nothing more than a manifestation of preferences that we collect over our lifetimes. I’m sure you have some colors you prefer to others. Color is really not about right or wrong, good or bad, but rather what is most appropriate for the task at hand. In this series, I hope to demystify color. We’ll cut through the static and figure out exactly why some colors work and others don’t, so you can focus on having fun and expressing yourself, rather than stressing out.

In this first installation, we’ll cover some basic terminology that we’ll use in future discussions. Once we’re on the same page it will be easier to explore the connections between these terms in detail.

hue

Hue is the identifier we attach to a color to describe its position on the spectrum. When we refer to hue, we are referring to a color in its pure form. Red, yellow, blue, green, orange, the names we know and love, these are all hues.

saturation

Saturation refers to the purity of a color. As grey is added to a color, it becomes less saturated. In most software, saturation is plotted along the x-axis of the color picker.

value

Value, sometimes called brightness, refers to a color’s location on a scale from pure white to pure black. In most software, value is plotted along the y-axis of the color picker.

chroma title

Chroma is similar to saturation in that it refers to a color’s purity. It’s a term mostly used by traditional painters and you won’t see it mentioned in most software, but it’s still worth learning. In a square-shaped color picker, any color along the entire right side will have a saturation level of 100%, regardless of its value.

100% saturation

Unlike saturation, peak chroma, or the purest form of a color, is value-dependent and will be different for each hue. The peak chroma of yellow, for example, can be found at a relatively high value when compared with the peak chroma of blue, which is much lower. In the chart below, chroma is plotted along the x-axis, and value is plotted along the y-axis. Notice how peak chroma occurs at a much lighter value for yellow, and a much lower value for blue.

peak chroma chart

tint

Tints refer to lighter versions of a color. You can create tints by adding white to your base color.

shade

Shades refer to darker versions of a color. You can create shades by darkening via the addition of black or other lower value color to your base color.

local color

Local color is the base color of an object when unaffected by light. As different light sources interact with an object, they influence its color. The local color shows us where to start.

colour-wheel (1)

The color wheel is a visual representation of the color spectrum, looped into a single continuous wheel.

color picker

When working digitally, most software will offer several different ways to pick colors. RGB is the system used to represent colors in digital spaces. RGB adjustments influence the displayed color by adding or subtracting red, green, or blue. LAB measures color in lightness, and along 2 axes, from red to green, and from blue to yellow. CMYK is used in print environments and measures color in cyan, magenta, yellow, and black. HSB/HSV uses the terms we covered earlier, hue, saturation, and value, sometimes labeled as brightness. It’s important to note that in a digital space, the same color can be achieved using any of these modes. For the sake of learning, we’ll use HSB/HSV as it will be the easiest to use when describing color.

Not too difficult, right? As you can see, there aren’t too many terms we need to learn before we can really dive in. Take the time to get acquainted with these, and the rest will come naturally.


Taylor is the Managing Editor of Notes on Design. Taylor is a graphic designer, illustrator, and Design Lead at Weirdsleep.


For creatives seeking a thorough training in design, digital video, and motion graphics, Sessions College offers accredited, fully online digital media certificate and digital media degree programs. Contact Admissions for more information.

Are you interested in exploring 3D modeling? Sessions College offers a range of online digital arts courses or 3D modeling courses for students at all levels. Contact Admissions for more information.

If you are interested in learning more about using color, Sessions College offers a Color Theory course and many other graphic design courses for students at all levels. Contact Admissions for more information.

This blog is powered by Sessions College, the leading online school of visual arts.