What is Color Saturation? A Helpful Guide to Digital Color

highly saturated flower colors

No matter what kind of visual media you’re working with, you’ve probably come across a few new vocabulary words while doing it.

Most digital art programs today are made for experienced artists who are used to working in a digital medium, so they don’t tend to come with a helpful tutorial on how to use them

. As a beginner, it can be difficult to figure out what tools you need for the job you’re doing.

For example, take color saturation.

Saturation is usually thought of as a measure of how much of a given element has permeated a particular medium. But when working with digital color, it refers instead to how much color “saturates” the given color sample.

The color can be anything in the visual spectrum; saturation is only a measure of how vibrant it is.

Too technical? That’s alright. Keep reading and you’ll see what we mean.

Saturation vs. Hue

As stated, saturation is about how much of a color is present. Hue, on the other hand, will give you what that color actually is. 

Let’s look at an example, shall we? 

Here we have a standard color wheel (this one being taken from Paint Tool SAI 2, for anyone who’s curious) that shows a fully saturated red color.

The color selected is seen in the bottom right in the first of that handy pair of boxes. Now, red is only the hue that we’ve selected from the wheel.

If we change the hue using the wheel, we get another color entirely. Here’s a nice bright sky blue with the same saturation and a different hue:

color saturation example 3

So far, so good. Hue is adjusted by using the round bit on the outside. The fully saturated versions of the colors selected by that wheel are visualized on the wheel itself. But what happens if we play with the square bit in the middle?

color saturation example 4

Well, that’s certainly a color!

It’s a lot less vibrant than the blue, and a little darker and duller too. That tells us that the square part in the middle has to do with two things: our saturation, and our brightness.

Brightness is how light or dark something is in relation to black and white; an absolutely desaturated color will be somewhere in between those two, probably looking like some kind of gray.

Meanwhile, a saturated color will always seem “loud” to the person viewing it.

Sliders and Values: Practical Applications in Digital Art and Editing

We’re going to start this section off with another example: a picture of a cat that likes to yell.

screaming cat image

Isn’t she majestic? (No theft accusations, please; this is an original work by the author.)

Now, if you look at a toolbar in an art or digital manipulation program, usually you’ll get something like this:

color saturation example 5

You can see the smaller version of our image in the corner for context on what’s being edited. As distracting as the cat is, however, what we’re looking at is the Color Adjustments drop-down.

From there, we’ll click on Hue/Saturation, and we should get this set of sliders:

color saturation example 6

All the properties of the color wheel, brought into a single handy set of sliders. Now, when we turn saturation all the way up, what happens to our cat?

color saturation example 7

Isn’t that interesting? Her mouth and eyes are affected, along with the frame of the picture, but the background and her fur are untouched. No matter how high you turn up the saturation, the black will still be black, and the gray will still be gray.

This is due to how machines process color.

There’s a concept in visual media called “information” that dictates how much a machine can read from a given image.

If the saturation was already zero to begin with, then no color information exists. If there’s no color information, then turning the saturation back up won’t do anything.

This is also the reason for really dark or poorly lit movies sometimes coming out looking like an absolute mess.

Just for fun, here’s what happens when we turn the saturation down:

image with no color saturation

On a related note, the sliders will always adjust from the starting point of where all the color values were when you began adjusting things.

The information available to process is still there at this point, but if you hit “OK” from a point of total desaturation, you remove that information and the program can’t process the colors anymore.

Turning it back up from here will only ever result in the same gray. It’s something to keep in mind.

A Note on Layers

Layers are a tool that can be used to cheat your way into the saturation and hue you want for your image overall. They can be used to do a lot of other things too, but for now we’re going to be looking at the ways they can change an image in a broader sense.

First, you’ll want to look to whatever part of your art program’s user interface looks a bit like this:

layers

Find whatever button it is that makes a new layer, and push that button. From there, use a bucket fill tool to just fill that layer with a color. In this case, we’re using the saturated blue from earlier.

layers 2

This will temporarily turn your image into a block of solid color, but don’t worry about that; as you can see, the image itself is still present underneath the color. It’s safe. 

From this point, you look at the “Mode” drop-down at the top of this menu, and you scroll through it until you find these four options way at the bottom:

layers 3

These options will turn the layer into something that has an effect on the image underneath it instead of a solid image on its own. For example, if we pick hue, we get this:

hue in color example

And if we pick saturation, the rendering program jerks to its senses and defaults to making the colors it can’t see into bright reds.

Everything that isn’t pitch black is turned as vibrant as the blue in the saturation layer, and this is the result:

saturation example

On the bright side, at least it matches her mood now.

Share on facebook
Facebook
Share on twitter
Twitter
Share on email
Email
Share on reddit
Reddit
Leave a Comment

Your email address will not be published. Required fields are marked *

Hi! I'm Rudy.
rudy dewatine

I’m a travel photographer from Paris, France. I blog and publish articles about camera lenses here at lensguide.io.

Hope you find them helpful, don’t hesitate to leave a comment!

You might also like:
Looking for something?