📚 Want to check out Dribbble’s 16 week Product Design course before enrolling? Sign up to our free info session happening this Monday!

Shot by #<User:0x000055d186051a10>

Art by Alex Davis

CMYK vs RGB: Everything you need to know

In elementary school, you learned that there are three primary colors: red, yellow, and blue. When you enter the world of graphic design, however, you learn that the RYB color model is actually very limited and can’t create as many other colors as we were led to believe.

Not a big deal for your grade school art projects, but as a professional graphic designer, it becomes more important.

In graphic design, there are two basic color spaces that you’ll work in:

  • RGB — Red, Green, Blue
  • CMYK — Cyan, Magenta, Yellow, and Key (or black).

The question is, what’s the difference between RGB and CMYK, and why does it matter?

In this article, we’ll explore both RGB and CMYK color spaces to better understand what they mean and how to apply them properly to your design work.


Understanding Additive vs. Subtractive Color Systems

The first thing to understand about RGB and CMYK is the difference between additive and subtractive color spaces.

  • RGB is an additive color space; when you add the colors together, you get white.
  • CMYK exists in the subtractive color space; white only exists when the colors are absent.

Digital displays use additive colors. They create over 16 million colors using red, green, and blue pixels at varying intensities.

Printed matter, by contrast, uses subtractive colors. Cyan, magenta, yellow, and black dots are used to create over 16 thousand colors.

By Focus Lab

What is RGB?

Additive color systems like RGB are called such because as you add the colors together, they get lighter until they reach white. Additive color systems like RGB are standard in digital material.

It’s logical if you remember that additive colors are created with light; the more light you add, the lighter and brighter the color gets.

Additive colors are created with light; the more light you add, the lighter and brighter the color gets.

The RGB additive color system is based on the way human vision works. We have three types of cone photoreceptors in our eyes: ones for red, green, and blue lightwaves. The brain then takes the light from those three receptors and interprets it as the millions of colors we see.

RGB color was first used in 1861 by James Clerk Maxwell, a mathematical physicist, when trying to create color photographs. He took three photos of the same subject with red, green, and blue filters, and when a white light was then shown through all three photos, it projected a full-color image.

RGB color space
By Lily

What is CMYK?

While additive color systems are the standard in digital imagery, subtractive color systems like CMYK are standard in printed material.

This can cause some issues with accurate color reproduction, since digital displays can create many more colors than printed inks or dyes.

In most color print jobs, you’ll start with a white background and use cyan, magenta, yellow, and black inks to block out parts of it and create various colors. You’re subtracting light from the original surface, hence the term subtractive.

Subtractive color systems like CMYK are standard in printed material.

Traditionally, the first subtractive color system was based on the RYB (Red, Yellow, Blue) model of mixing color pigments. While this color model can create many other colors when combined together, the CMY (Cyan — also referred to as “process blue,” Magenta — also referred to as “process red,” and Yellow) model is even more versatile. When black (or Key) is added into the mix, thousands of other colors can be created.

This CMYK color model was first used in commercial printing in 1906 by the Eagle Printing Ink Company, though it didn’t become the standard for 4-color printing until the mid-1950s.

CMYK color space
By Alex Davis

When should you use CMYK versus RGB?

Which color model you use (CMYK vs. RGB) depends on the work you’re creating.

When designing for digital products (web designs, social media graphics, mobile designs, etc.) you’ll work in the RGB color space. While color accuracy between different kinds of digital displays varies, you’ll be able to see a fairly accurate representation on your own displays of what your users will see.

When working in print media, you’ll use the CMYK color space for your designs. This is where things get a little bit trickier. Printers will automatically convert RGB digital files to CMYK prior to printing, but this automatic conversion can create colors that appear significantly more muted than the colors you see on your display.

To help prevent this drastic difference in the final product, make sure that you’ve set your file’s color space to CMYK. While some colors may still not be a 100% match between your screen and the final printed product, you’ll get a much better approximation.

rgb cmyk
By Ksu Angeltseva

Issues converting RGB to CMYK

One of the biggest issues you may encounter as a graphic designer is when converting RGB images to CMYK. You’ll often find that the colors are not reproduced accurately.

When creating printed materials, you’ll want to make sure you’re working in a document set up to mimic CMYK colors for the most accurate end product.

RGB and CMYK colors

Understanding the basic differences between CMYK and RGB color modes makes your job as a graphic designer more efficient and helps prevent surprises in your final products—whether they’re print or digital. As for the RYB color model you learned as a child, that’s still used when mixing paint pigments, so it’s a good idea to keep that one in the back of your mind as well. ■

Cameron Chapman About the Author — Cameron Chapman: Editor. Blogger. Author. Designer. Copywriter. Marketer. Entrepreneur. Speaker. Consultant. Coach. I wear a lot of hats. What most of them have in common, though, is storytelling.

Find more Process stories on our blog Courtside. Have a suggestion? Contact stories@dribbble.com.