Gah, Don’t Use RGB in Print Designs! The Quick Cheat Sheet You’ll Love for Design Color Modes.

Dylan ZsigrayGraphic Design

binder of colors with RGB and CMYK codes

CMYK, RGB What?

You have likely come to realize that there are many acronyms in the graphic design industry that are used by career professionals in their day-to-day jargon. But, for those who are just entering the industry, or for sole proprietors & small business owners trying to design some quick things for their companies, these terms can be confusing! Two of the terms that tend to confuse up-and-coming designers are “RGB” and “CMYK.” You may have seen these before in an article or on the back of some user manual, but what do they mean?

despicable me minion gif

RGB and CMYK are color modes, a term that describes how color is understood and produced by two different devices: screens and printers. RGB stands for Red, Green, and Blue and is primarily used with technology. TVs, computers, and phones all have screens, which are comprised of pixels, which display color using RGB values. CMYK stands for Cyan, Magenta, Yellow, and Key (black) and is commonly associated with printers. When you replace an ink cartridge in your color printer, you will probably notice that each cartridge is labeled as C, M, Y, or K!

As end-users, we often do not think much of RGB and CMYK — we just want the applicable devices to work. When we turn on our TV or print a photo, we want to see color, not black and white. For designers, however, having a basic understanding of RGB and CMYK is crucial. This is because if you create an RGB-based design and print it out, the colors will not look right. Similarly, if you design a graphic in the CMYK mode and put it on a website, the colors will not appear correctly on your computer.

In this blog, we will go over which color mode to choose and how to properly set-up your document in three common Adobe Creative Cloud programs: Photoshop, Illustrator, and InDesign.

For Digital Graphics, RGB Is Your Friend

If you are designing a graphic for a website, social media, or a phone, you will want to use the RGB color mode. I always ask myself what the end medium for my design is. In this case, since people will see the design on their computer or phone screen, we need to use RGB so it plays nice with the screen’s pixels.

In most cases, it is best to use Photoshop when designing in the RGB color mode since Photoshop is pixel-based. However, there is an exception. If you are designing a vector (SVG) icon for a website, for example, you would want to use Illustrator since it is vector-based. We will cover the difference between pixels and vectors in a later blog. For now, we will focus on Photoshop as this is most common when designing in the RGB color mode.

photoshop color mode option

When you first create a document in Photoshop, there is a dropdown that asks for what color mode you want to use. This is set to RGB by default. As an aside, you also want to make sure your resolution is set to 72 pixels/inch (PPI). A standard screen resolution is 72 PPI, so if we are publishing this design to a screen-based medium, we want to make sure we mirror the resolution properly. Once both the color mode and PPI are set properly, you are good to go ahead and start designing!

For Print Graphics, We Will Hang Out With CMYK

If you are designing a graphic for print, like a flyer, brochure, or booklet, you will want to use the CMYK color mode. Since printers use cyan, magenta, yellow, and black ink to print color, we want to make sure our designs match this. With print graphics, we use Illustrator or InDesign.

I was always taught that Illustrator is for single-page print graphics or for a collection of printables that vary in size (e.g. a campaign flyer and postcard). Conversely, I was told that InDesign is used for programs or booklets. However, as I’ve worked with more designers, I have noticed there is a gray area. Some designers love using InDesign for quick, single-page designs due to the ability to create (and change) paragraph styles, and for being able to package and export the entire project.

illustrator color mode option

In the end, it is your choice of what you prefer to use. Illustrator gives you the option to change color modes at the start, while InDesign is by default CMYK. When you first create a document in Illustrator, there is a dropdown that asks for what color mode you want to use. Also, just like with screens, there is a recommended PPI for print: 300 PPI. This ensures your printed colors are crisp and sharp.

Illustrator gives you the option to use the RGB color mode as well. This comes in handy if you are creating a PDF for use online or if you are designing, as aforementioned, some vectors that will be used online. Just like with Photoshop, if we are using Illustrator to design for screens, we will switch to the RGB color mode and change our raster effects to 72 PPI via the dropdown.

In Illustrator, once you choose the color mode and raster effect, you are good to start designing! In InDesign, it is set to this already since the program is really only used for print creations.

Why Does This Matter? Red is Red, Right?

Well, actually, in terms of screens vs printers, red is not red. Take a look at the graphic below. There are two squares, each with the “same” color red. One was exported in RGB, the other in CMYK. They are not the same, right? The RGB square looks more vibrant, which makes sense because RGB produces more vibrant colors that can only be displayed properly on screens. This simple graphic highlights the importance of making sure your document is in the right color mode.

rgb versus cmyk red
You can spend all day choosing the best color palette for you and creating a beautiful graphic. However, if you use CMYK for screens or RGB for print, the color you see when you are designing is not going to match the color that ends up in the final product. Save yourself frustration and confusion by following this rule of thumb:

  • RGB is for Digital and Used in Photoshop
  • CMYK is for Print and Used in Illustrator and InDesign

There are always caveats, and as we have discussed you may use Illustrator for RGB-based designs. But, in most cases, the above rule of thumb serves beginning designers and at-home creators quite well.

Interested in having someone else handling graphic design for your company? Contact Spark Creative today to see how we can help ignite your brand with our (graphic design) spark!

contact spark creative banner