Imagine a colour, any colour. It could be bright and vibrant, or dark and dull. You’ve probably seen it somewhere, maybe in your favourite movie or on a cool poster hanging in your office. Combine enough colours and soon you’ve got a cool design. If you’ve ever wanted to put that design on something and sell it, you’ve probably done some tinkering in Photoshop.
The print file you get out of Photoshop and the image as it appears on your t-shirt might not be the same though. Often, the difference has to do with colour spaces, and why there’s a difference between how colours appear on our screens and how they look in real life.
In this post, I’ll go in-depth about one of the trickier colour-related topics–RGB vs. CMYK colour spaces. I’ll break it down by answering some of the most important questions:
What are RGB and CMYK and when do we use them?
What is the difference between RGB and CMYK?
What is the most suitable colour space for printing?
Is CMYK better than RGB?
Let’s start with some basic colour facts. All the colours we can see with our eyes are part of the visible colour spectrum. They’re represented in the circle below.
Visible colour spectrum
What is RGB?
RGB stands for the three colours Red, Green, and Blue. The colour space uses Red, Green, and Blue light to make new colours. RGB (Red, Green and Blue) is the colour space for digital images. Use the RGB colour mode if your design is supposed to be displayed on any kind of screen.
A light source within a device creates any colour you need by mixing red, green and blue and varying their intensity. This is known as additive mixing: all colours 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 colours. Because it’s done digitally, the designer manipulates how the light on the screen manifests to create the colour they want.
You can see the RGB range compared to visible colours in the picture below.
RGB colour spectrum
Each pixel in the digital devices we use has three tiny, slightly overlapping RGB light sources that trick our eyes into seeing just one colour when looking from a distance.
When to use RBG?
If the end destination of your design project is a digital screen, use the RGB colour 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
icons
buttons
graphics
branding
online logos
online ads
social media
images for posts
profile pictures
profile backgrounds
visual content
video
digital graphics
infographics
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 stands for Cyan, Magenta, Yellow, and Key/Black. It is the colour space for printed materials. It’s basically the opposite of RGB; it uses coloured ink to mask colours on a light background. This light background (usually white) reflects light, so each layer of ink applied subtracts from white light to make new colours.
For example, if you combine Yellow and Magenta (meaning subtract yellow from magenta), then you get Red. You can combine any two Cyan, Magenta, or Yellow colours to create one of the three RGB colours.
If it’s confusing, just try to think about drawing with coloured pencils. If you combine two different colours, you’ll get a third. It’s the same idea behind CMYK.
When you combine all three colours, you get grey. Since we also need black, it’s the fourth colour. This is also why CMYK is sometimes called the four colour space.
A printing machine creates images by combining CMYK colours to varying degrees with physical ink. This is known as subtractive mixing. All colours start as blank white, and each layer of ink reduces the initial brightness to create the preferred colour. When all colours are mixed together, they create pure black.
Compared to RGB and visible colour, the CMYK range looks like this:
CMYK colour spectrum
When is the CMYK colour space used?
CMYK is recommended for any printed material. This includes any products, from apparel to mugs, posters, and more.
Why do we use CMYK for printing? It reflects the colours more accurately.
With CMYK, colour intensity is not as flexible as in RGB. It’s just impossible to replicate on ink paper or fabric the same intensity and brightness that a digital display can show.
This means some RGB colours will show up differently when printed in CMYK. The software you’re designing in (Photoshop and others) is set to RGB colour space by default (in most cases: sRGB colour profile specifically). That’s fine if your designs are only going to appear online, but printed designs need to be done in CMYK.
We recommend using CMYK when designing print files for a few reasons:
RGB files tend to be smaller
Only advanced software has the option to design in CMYK
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 colour mode will give you more accurate results.
Turn to CMYK if your project involves:
Branding
business cards
stationary
stickers
signs & storefronts
Advertising
billboards
posters
flyers
vehicle wraps
brochures
Merchandise
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 convert RGB to CMYK
This depends on the software you use and which version you have, so I recommend finding a tutorial online for the software you have.
Is CMYK better than RGB?
CMYK and RGB have different uses, and it’s important to know when to use which. Since we’re focusing on printing, we want to stay within the CMYK range. However, technology is advancing and printers can already print colours outside of the usual range, although we still suggest sticking to approved methods. What happens if you don’t convert your RGB colours to CMYK? Sometimes when you try to show a file in a CMYK colour mode on screen, or print out a photo in anRGB colour modes, it can sometimes produce some pretty crazy results. For tips on how to set up these colour modes, check out my blog post here.