CMYK vs. RGB — When To Use Which

There are several color languages and picking the right one in a design file is critical to achieving the desired color in the final product. Knowing which color language to use depends on your application. The most popular color languages or color modes are RGB, CMYK, Spot colors (like Pantone, CSI, Archroma, Coloro, Behr, Sherwin Williams…), CMYKOGV, LAB, LCH, HEX, LAV.

Knowing which to use can be challenging. Over the next few months, ColorKarma will be featuring articles explaining the basics of these color languages and how they translate to the end product.

The Most Common — RGB and CMYK.

A few years ago, I wrote a piece about how we were taught color wrong as children. Through finger painting, we learn that red and blue make violet and yellow and blue make green. But when it comes to design and color mixing that isn’t always the case. To understand the most common color languages you need to understand additive and subtractive color theory as it relates to our everyday word and specific use cases.

And God Said Let There be Light.

Before there was light there was darkness. Light comes from adding colors. All colors begin as black darkness. When red, green, and blue light (RGB) are added at an equal amount, then you get pure white light. This forms the basis of the RGB color theory. Anyone who has seen a stage play may have seen red, green, and blue lights that are used to highlight an actor or build up to that bright white spotlight on the stage. Since you are adding the colors to make white, RGB is considered an additive color space.

The primary application for RGB is digital. This means computer screens, smartphone screens, TV screens, anything with a screen. This could be an old tube television or a new 4K HD television, they all use light to create colors. The light source within a device’s screen creates a wide spectrum of color by mixing red, green and blue and varying their intensity.

Communicating for Digital Applications.

When someone is developing an app, or website or anything digital, the two primary forms of color communications are RGB and HEX. RGB is communicated as three numbers, each one ranges from 0–255. For example, white is 255,255,255 and black is 0,0,0.

The second way to communicate color for digital applications is HEX. It stands for hex triplet, a six-digit, three-byte hexadecimal number most commonly used for digital applications like apps, websites and other online display graphics that use Hypertext Markup Language (HTML), Cascading Style Sheets (CSS) and Scalable Vector Graphic (SVG).

SMEEK.

Cyan, Magenta, Yellow and Black, also known as CMYK (and pronounced ‘Smeek’ in Russian which has stuck with me) is a substrative process. Most of the things you buy or print at home use this color combination. Many folks confuse CMYK for an additive process. It is a logical mistake because printers add Cyan or add Magenta to the page. In that context they are correct. However, unlike RGB where we begin in total darkness, printing starts on a white, blank sheet of paper. By placing Cyan, Magenta, Yellow or Black ink on a white sheet, light is absorbed by the ink and reflected back to us to see. If I have a Green and Blue light, I am left with Cyan. If I have Red and Green light, I will make Yellow. In theory, Cyan, Magenta and Yellow should make black but in reality, most things are never perfect, and Black is used to create a solid black, or save on ink costs. CMYK is communicated in percentage from 0 to 100. A bright red would be communicated as C0, M94, Y100, B0.

But I Want More.

CMYK can produce a fair number of colors, but when it is compared to RGB it simply can’t. The two-color spaces are vastly different in shape and size. Depending on the printing technology, the range of colors can change even more. I did a great video comparing it to a football and baseball, which you can see here.

When a brand or a design requires a specific color, this may call for a spot color. This is where companies like CSI, Pantone, Coloro and others come into play. Pantone uses 18 different colors to make 2,161 colors. When you look at the math… four colors, CMYK, makes less combinations than 18 colors.

Build a Bridge.

If you are producing products or printing in CMYK only and are working with a Pantone color, then you must refer to the Pantone Color Bridge. This is so important, and a mistake too often made. Not all Pantone colors can be produced in CMYK exactly, and while some are close there are areas outside the color range (aka color gamut), like oranges and violets there can be a dramatic difference. The Pantone Color Bridge Guide shows the Pantone color as a spot color along with its CMYK equivalent. As a designer or product manager, you may begin with a Pantone, but it is vital to work with your supplier to communicate and align on the CMYK expectations of that color. If you are printing your job as a Pantone spot color, also referred to as a fifth plate, you should communicate the actual number and type. Pantone printing systems come in Uncoated and Coated (C for coated paper and U for Uncoated Paper). A bright red like our earlier CMYK example C0, M94, Y100, B0, would be called out as Pantone 2347-C. It is produced by a custom ink, not a recipe of CMYK mixes. This specialty color, Pantone color or spot color is specialty ordered or mixed on site at the production facility. It’s important to note that spot colors are more expensive than CMYK. The more spot colors used in a design, the higher the cost. One last note, if you are using a Pantone color that does not end with a U or a C, then you might be using the wrong system entirely. (I will discuss that in a future piece).

Producing a product, an app, website, book, magazine, package or anything, requires a basic understanding of color, material and technology. Today, marketers, designers and product managers work within a digital and physical world. This means they need to work within both RGB and CMYK spaces. When we start with color, we work within the color space (color gamut) that is achievable on the technology, in this case a monitor or a printed marketing material. Choosing a color space that breaks the laws of physics and impossible to produce will only frustrate yourself, your clients, and your supplier.

Smart designers work and understand the color space for their applications. Working within the ‘guard rails’ of a color space does not limit colors; it simply keeps you on the road and not off into the ocean.