This post is the third installment of a four-part series on image concepts that often elicit confusion and frustration. We kicked off our adventure with a detailed look at the technical, sometimes confusing topic of image resolution. Then we switched gears in part two and explored the difference between vector and raster images.
Let’s cover a topic that bleeds into most other areas of our lives: color. While most of us have been identifying different shades and hues since we first toddled around, there is a lot about color you may not know – particularly with images. There are two different color modes (or spaces, or gamuts) that an image can have:
- RGB (Red, Green, and Blue) – These are the primary colors of light and are also the colors that make up the pixels in any digital display or video screen. This is the mode you want to be in if you’re designing for digital.
- CMYK (Cyan, Magenta, Yellow, and Black) – These are the colors of ink, dye, or pigment used in what is commonly called “4-color process” printing. This is the mode you want to be in if you’re designing for print. If you’ve ever purchased replacement ink cartridges for a home printer, you might already be familiar with these four colors.
Continuing our America the Beautiful theme, imagine if I asked you to paint Old Glory on white canvas using only Red, Green and Blue paint… No problem, right? Ignore the Green paint altogether, and just use the Blue around the stars and the Red for every other stripe.
But what if I gave you only these paint colors?
Well, you might already know that Yellow+Magenta=Red, and Cyan+Magenta=Blue, so you’ll mix those up and be on your way.
But will your flag look as good? Probably not. Why? Color gamuts. This color theory term describes a range of colors that a particular device can reproduce. A phone screen, for example, has a larger gamut than your home printer.
See how the CMYK space is the smallest in the chart on the left? That means it can produce the smallest range of color. That’s why the CMYK colors are far duller in the color comparison on the right.
So the American Red & Blue paint that you used in your first painting are going to be way brighter and more vivid than what you were able to mix up the second time around. The two would probably look a little like this side-by-side:
What does it all mean?!
When designing for digital screens, make sure your program is set to RGB mode to get the maximum vibrancy for your images. If you’re want images printed, they should be in CMYK mode. Anytime you go from RGB to CMYK, you’re going to lose vibrancy in color. You have to decide whether or not to design for the lowest common denominator and use only colors that can be reproduced accurately in CMYK. Otherwise, that new neon green logo is going to look pretty drab on all those banners you just had printed.
)
