Whether you’re a designer or you’re getting a design, it’s important to know the difference between the RGB and CMYK color modes so you can plan and optimize each stage of the design process. That goes beyond just knowing what the letters stand for—spoiler alert: they’re mostly colors!—because it’s more about knowing which one is the best for your project. Depending on where and how the final result is displayed, one color space is always better than the other.
Never fear these acronyms again! We’re going to explain what the RGB and CMYK color modes are, how they work and when it’s best to use each.
What is the difference between RGB and CMYK?
Both RGB and CMYK are modes for mixing color in graphic design. As a quick reference, the RGB color mode is best for digital work, while CMYK is used for print products. But to fully optimize your design, you need to understand the mechanisms behind each. Let’s dive deeper.
What is RGB?
RGB (Red, Green and Blue) is the color space for digital images. Use the RGB color mode if your design is supposed to be displayed on any kind of screen.
A light source within a device creates any color you need by mixing red, green and blue and varying their intensity. This is known as additive mixing: all colors begin as black darkness and then red, green and blue light is added on top of each other to brighten it and create the perfect pigment. When red, green and blue light is mixed together at equal intensity, they create pure white.
Designers can control aspects like saturation, vibrancy and shading by modifying any of the three source colors. Because it’s done digitally, the designer manipulates how the light on the screen manifests to create the color they want.
When to use RGB?
If the end destination of your design project is a digital screen, use the RGB color mode. This would go for anything that involves computers, smartphones, tablets, TVs, cameras, etc.
Turn to RGB if your design project involves:
- web & app design
- online logos
- online ads
- social media
- images for posts
- profile pictures
- profile backgrounds
- visual content
- digital graphics
- photographs for website, social media, or apps
What are the best file formats for RGB?
JPEGs are ideal for RGB files because they’re a nice middle-ground between file size and quality, and they’re readable almost anywhere.
PSD is the standard source file for RGB documents, assuming all team members are working with Adobe Photoshop.
PNGs support transparency and are better for graphics that need to be superimposed over others. Consider this file type for interface elements like buttons, icons or banners.
GIFs capture motion, so if you’re using an animated element, such as a moving logo or a bouncing icon, this file type would be ideal.
It’s best to avoid TIFF, EPS, PDF and BMP for RGB purposes. These formats are not compatible with most software, not to mention they can be unnecessarily large in terms of data.
What is CMYK?
CMYK (Cyan, Magenta, Yellow, Key/Black) is the color space for printed materials.
A printing machine creates images by combining CMYK colors to varying degrees with physical ink. This is known as subtractive mixing. All colors start as blank white, and each layer of ink reduces the initial brightness to create the preferred color. When all colors are mixed together, they create pure black.
When to use CMYK?
Use CMYK for any project design that will be physically printed, not viewed on a screen. If you need to recreate your design with ink or paint, the CMYK color mode will give you more accurate results.
Turn to CMYK if your project involves:
- business cards
- signs & storefronts
- vehicle wraps
- t-shirts, hats and other branded clothing
- promotional swag (pens, mugs, etc.)
- Essential materials
- product packaging
- restaurant menus
What are the best file formats for CMYK?
PDFs are ideal for CMYK files, because they are compatible with most programs.
AI is the standard source file for CMYK, assuming all team members are working with Adobe Illustrator.
EPS can be a great source file alternative to AI because it is compatible with other vector programs.
All things considered, it’s always best to consult your printer beforehand to find out which file format they prefer.
How to set up RGB and CMYK color modes in design programs
If you’re using Adobe software, here’s how to set up your color mode for a new project.
How to set the color mode in Photoshop
When you create a new document in Photoshop, the Color Mode option will be included with other parameters in the New Document window.
How to set the color mode in Illustrator
When you create a new document in Illustrator, the Color Mode option will be hidden under the Advanced Options collapsable menu. Click on the arrow to expand this menu.
How to set the color mode in InDesign
InDesign automatically sets the default color mode depending on which type of document you choose (either in the Print or Web/Mobile category, which translate to CMYK or RGB respectively).
When you work with colors inside the program, you’ll notice that swatches will already be measured in RGB or CMYK values depending on which type of document you are working in. Because InDesign allows you to mix color spaces, you can change the color mode of individual swatches whenever you create one, but in general it is best to keep colors consistent.
How to check whether your document is in RGB or CMYK mode
If you can’t remember what mode you set your document to or you are working with someone else’s file, here’s how you check the color mode.
How to check the color mode in Photoshop
In Photoshop, the color mode is listed in parenthesis in the document’s tab. You can also find it by navigating to Image > Mode. The document’s color mode will have a checkmark next to it.
How to check the color mode in Illustrator
In Illustrator, the color mode is listed in parenthesis in the document’s tab. You can also find it by navigating to File > Document Color Mode. The document’s color mode will have a checkmark next to it.
How to check the color mode in InDesign
One easy way to check the color mode in InDesign is to use the Color panel. Navigate to Window > Color > Color to bring up the Color panel if it is not already open. You will see colors measured in individual percentages of CMYK or RGB, depending on your document’s color mode.
How to convert between RGB and CMYK
Some of you may be thinking, “Well, this article would have come in handy when I first started the project!”
Don’t despair. Yes, it’s important to start a project in the correct format, but it’s still possible to convert between RGB and CMYK if you need to.
Be prepared for the colors to look different (darker or lighter due to additive or subtractive mixing). If you are a designer, you will have to explain this to your client. And in addition to changing the document’s color space, you may need to change the colors themselves to find an approximation of what you had before.
Here’s how to use design software to convert between RGB and CMYK color modes.
How to change the color space in Photoshop
To change the color mode of your Photoshop document, navigate to Edit > Convert to Profile. This will bring up a dialogue box. What you want to pay attention to is the Destination Space field. Use the dropdown to select your desired color mode.
There are different libraries of RGB and CMYK colors, which is why you will see multiple options. For general purposes, the first two options are fine, but you may want to check with your printer beforehand to be sure of what they need.
If your image is not already flattened, check the Flatten Image to Preserve Appearance box as your colors may not come out as well in multiple layers with blending/transparency between them. Once you’re ready, hit OK and you will see the color mode information change in the tab at the top of your document.
How to change the color space in Illustrator
To change the color mode of your Illustrator file, select all objects in your document. Navigate to Edit > Edit Colors and select your desired color space.
How to change the color space in InDesign
You can change the color mode of your InDesign document in the export process. Navigate to File > Adobe PDF Presets > [Press Quality] and select a save destination. In the Export Adobe PDF popup box, select Output on the left side and use the Destination dropdown menu in the Color section to choose your desired color mode.
This method can be helpful in a pinch, but if you are working with a lot of different images, it is best to change the image’s color mode through their native programs (like Photoshop or Illustrator) assuming you have linked them.
Know your color modes
Knowing how the colors interact to define a pigment can give you greater control over how the final color looks, and therefore greater control over your final design. The more you work within a particular color mode the better you’ll get at predicting how the design file will translate to an end product. That’s why if you want picture-perfect colors every time, it’s best to hire a professional designer.
This article was originally written by Peter Vukovic and published in 2012. It has been updated with new examples and information.