RGB vs. CMYK: A guide to color systems for designers

What they are, and how to keep your colors bright and vivid in your designs

Envato
Envato
4 min readFeb 14, 2017

--

By Brenda Stokes Barron

Color plays an important role in everyday life. It can affect your mood, your impression of a brand, and even influence your buying choices. Getting the color right in your designs is crucial if you want to convey the right message.

But as a designer, you should also know which color system to use if you want your design to look as intended. Knowing which color system to use will be a lot easier when you know how your design will be used.

There are two major color systems in the digital and print design industries: the RGB color system and the CMYK color system. In this article, we’ll explain the difference between the two and show you how you can easily switch between them in Photoshop, Illustrator, and InDesign.

In short:

  • RGB = Red, Green, Blue. Use for digital designs.
  • CMYK = Cyan, Magenta, Yellow, and Key. Use for anything printed.

What is RGB?

Copyright: alancotton / 123RF Stock Photo

RGB stands for Red, Green, and Blue. It’s used exclusively in the digital design industry because it represents the same colors used in computer screens, TV screens, as well as mobile device screens.

It’s an additive color system which means that the primary colors are added together in various combinations to produce a much wider spectrum of colors. These colors are produced by blending light itself by superimposing the red, green, and blue light beam. Without any intensity, each of those colors will be perceived as black, while full intensity will make them appear white.

It’s also worth mentioning that different intensities of each color will produce the hue of a particular color. The resulting color will also appear more or less saturated depending on the difference between the most and the least intensive color.

When should you use the RGB color system?

As a general rule of thumb, the RGB color system should be used only in digital designs, most commonly when designing for the web. This includes designing websites and imagery and graphics for use on websites and social media.

If you want to use those designs in print, you will have to convert it to the CMYK color system.

What is CMYK?

Source: Wikimedia Commons

CMYK stands for Cyan, Magenta, Yellow, and Key (Black). Black, in this case, is referred to as key because it is used in the key plate which is responsible for adding the contrast and the detail for the final image.

The CMYK color system is most commonly referred to as the four-color process because it uses four different colors to produce different hues. The black color here is used because the other three colors combined cannot produce a fully saturated black.

Unlike the RGB color system, CMYK is a subtractive color model because the printed ink reduces the light that would normally be reflected. The inks used subtract the brightness from a white background from those four colors.

The CMYK colors are mixed during the printing process which can sometimes cause minor inconsistencies. For that reason, you should always look at the printed proof of a given project before going through with the full print run.

When should you use CMYK?

As hinted in the previous section, CMYK is the recommended color system for any material that will be printed. This includes business cards, brochures, letterheads, and any other business collateral.

Since this color model is the only one that can produce the greatest accuracy when printing color photography, it should be your primary choice for any print job that uses more than four colors.

How to convert RGB to CMYK in Adobe programs and keep your colors vivid

Nowadays, most design software is set to the RGB color system. If you’re designing for the web, that’s fine, but if your project is intended for print, you need to switch from RGB to CMYK.

Here’s how to do it in the Adobe programs which are considered the industry standard.

  • In Photoshop, click Image > Mode > CMYK Color.
  • In Illustrator, click File > Document Color Mode > CMYK Color.
  • In InDesign, click Window > Color, then click the dropdown button in the upper right corner and select CMYK.

But what happens if you need to design for both print and web for the same project? In that case, it’s recommended to start with the CMYK model and design all the print assets first. Then, switch to the RGB model and design the assets for the web. Doing so will give you a closer match in colors as RGB has a wider range of colors which may turn out quite pale when you convert them to CMYK.

Brenda Stokes Barron writes about colors, among other things.

This article was originally published on the Envato Blog.

--

--