RGB vs. CMYK: A Crash Course in Color Formulas

 
Group 473.png
 
 

Learn the basics in this quick and informative read.

 
 

The first thing to know: there are two different kinds of color.

Color is the term we use to express varying levels and frequencies of light. Color occurs in two different types of media:

  1. Physical Media: paper, books, magazines, posters

  2. Digital Media: phones, TV, laptop, any screen that plugs in

When we’re dealing with color for physical media, or things that are “printed,” we use a system for color called CMYK.

When we’re dealing with color for digital media, or things that plug in, we use a system for color called RGB.

Why are there two different color systems? Because color in physical media works differently than color in digital media. One is based on ink, and the other is based on light.


 
Printing Graphic.jpg
 

CMYK: Color Using Ink for Physical Media

When we print something, we use the CMYK color formula, often called “four color” printing. The name CMYK comes from the first initial of each of the four colors in the formula:

Cyan, Magenta, Yellow, and Black

CMYK formulas have four values; one value for each of the four colors in the formula. Those numbers tell the printer how much ink of each color to use. The values in a CMYK formula range between zero and 100.

Here’s the CMYK formula for white:

C=0 M=0 Y=0 K=0

With a “zero” value for each color, you’re sending “zero” ink to the printer. That would result in “white,” or a blank page.

The higher the values in a CMYK formula, the darker the color will be. Make sense? Higher CMYK values translate to more ink. More ink makes images darker.


 
Laptop Graphic.jpg
 

RGB: Color Using Light for Digital Media

When we’re working with an electronic screen, like on your phone or your laptop, we use the RGB color formula. The name comes from the first initial of each of the three colors in the formula:

Red, Green, and Blue

Screens don’t work with ink, of course, they work with light. Just like CMYK formulas, RGB formulas are also made up of a value for each color. That value tells the device how much of each light to use to produce color. The values in an RGB color formula run between zero (no light) and 255 (full light).

Here’s the RGB formula for white:

R=255 G=255 B=255 (all three colors at their highest value)

And here’s the RGB formula for black:

R=0 G=0 B=0 (all three colors at their lowest value)

Brighter colors will have higher RGB numbers. Darker colors will have lower RGB numbers.


More Ink = Darker, More Light = Brighter

We have two different systems for color because we’re working with media that behave in opposite ways. Adding more ink to a page makes something darker. Adding more light to a screen makes something brighter. So when we increase CMYK values, we’re adding ink, and that makes things darker. When we increase RGB values, we’re adding light, and that makes things lighter.


Accurate Color Reproduction

So why do all of these systems and formulas exist? So we can re-create color accurately and consistently. Think about the Owens Corning Pink or the Starbucks Green. Those colors should look the same no matter where they appear, and there are formulas to make sure that happens.

The very first step in achieving accurate color is determining how the color will be reproduced. When you’re working with print, you’re going to use CMYK color formulas to reproduce color accurately. When you’re working with powered screens, like on your phone or a television, you’re going to use RGB formulas to reproduce color accurately.

Graphic designers use software that’s built to maintain consistent color formulas in print or digital throughout the production process. If you need accurate color, hire a skilled graphic designer (like the ones here at Ad Ease) who understands color theory, and uses professional software calibrated for color consistency.

There’s a lot more than color formulas to accurate color reproduction, so if you don’t know about color profiles, monitor profiles, and all of the other aspects of color reproduction, for best results, get some help from a pro.


The Index Color Formula

There’s one more color formula we get asked about, so here it is. It’s called Index, and it’s another way to accurately produce color. It’s also called “Hex” or “Hexadecimal.” All of those names refer to the same formula.

Be prepared: index formulas are odd. They’re six characters long, made up of three pairs of two characters each. Those pairs are either lower case letters a - f, or numbers 0-9. An index color formula is always preceded by a hash symbol (#). Here’s the index formula for a nice, vibrant red:

#c41b1e

C41B1E.png
 

Index formulas are really just another kind of RGB formula. Those pairs in the formula are actually the red, green, and blue values.

#c4 (red value) 1b (green value) 1e (blue value)

Index formulas have magical properties. For example, you can rearrange the pairs of numbers in an index color formula to create new, complementary colors.

In our example above (#c41b1e), the red part of the formula is represented by the first two numbers: c4. The green part is represented by the second two numbers, 1b. The blue part is represented by the third set of two numbers: 1e.

Let’s rearrange those values. We’re going to make the red 1e, the green c4, and the blue 1b. Same pairs, just placed in different positions. What’s the result?

#1e c4 1b

1EC41B.png
 

Color questions? Head for the web.

What do you do if you know one formula for a color, but you need a different one? Or don’t know the formula at all? Head for the web. Rapid Tables is just one of many web sites that will convert formulas from one to another for you. And if you know a graphic designer, they probably have software that can provide those formula values.

Here are two more awesome color-related web sites.

Color Supply - create color schemes

Brand Colors - see the color schemes for famous brands