The basics on RGB, CMYK, and hex colour codes
When I first started learning graphic design, colour codes made me so overwhelmed. What is RGB? What does CMYK stand for? And how do I know which one to use?
Although I’m not an expert, over the years I’ve learned enough to not be intimidated. I hope this post can help you navigate color codes with confidence. I’ll review the most common formats, the basics of what they mean, and when to use them.
The most common colour codes (and the ones I’ll be covering in this post) are RGB, CMYK, and hex (or hexadecimal). You might also come across PMS or HSL which I’ll touch on briefly. Some are used mainly for print and others for digital, but even that’s not a hard and fast rule so I’ll try to keep things simple.
RGB
RGB stands for red, green, blue, and is probably one of the most common codes you’ll come across. RGB is primarily used for digital but there are also some types of printing that use this as well—photography, some fabric printing. For this reason, I usually create my artwork and patterns in RGB and then convert them later if needed. You will notice a difference between RGB and CMYK so if you are printing it’s important to check how your colours convert.
CMYK
CMYK stands for cyan, magenta, yellow, black. Cyan being a painfully bright blue and magenta an equally bright purplish-red. This colour format is used for printing. If you’re creating a project or piece of art where the intent is to get it printed (book, magazine) I would create the file in CMYK. Most printers will want your file and all the assets in it (for example, photographs or illustrations) converted to CMYK before you send them your final file. That said, usually printers will communicate with you on their preferences. If not, just ask to confirm. I’ve asked many a question that I thought might be really stupid, but I’d rather ask and get it right than panic and do something wrong.
Hex
Hex color codes are formatted with a hash and six numbers or letters, like this: #7282ed. This colour format is often used in web design and I’ve noticed it becoming more commonly used and shared. This is the format I use when I’m building colour palettes as it’s something that’s easier to remember and share. You can use these codes to add colours in a design program like Canva or Illustrator. For example, I’ll build a colour palette with hex codes and then add colours to my design file that’s in RGB. They’re also often used online in website builders (like Squarespace) or email platforms (like Mailchimp or Flodesk).
HSL & PMS
Two other formats you might come across are HSL and PMS. HSL stands for hue, saturation, lightness. It can be a great format for developing colour systems and is often used in web design. It’s helpful to know what it is in case you come across it but not necessary for the most common applications you’ll come across. PMS refers to the Pantone Color System and it’s largely used as a way to standardize colour matching. When designers, manufacturers, and printers use PMS colour codes they know they’re referencing the same colour regardless of lighting, material, print process. If you work in surface design or packaging, it’s definitely possible you’ll come across PMS at some point. If you want to know more, you can start with the basics on Pantone’s website.
There are so many different colour formats and applications and a lot that goes into how colours work. But I hope this basic guide helps you get started with your learning and allows you to feel less overwhelmed by the world of colour. There’s so much to learn, but I’ve found that knowing these basics empowers me to know what questions to ask and how to go about learning more.
To get you started on that learning, this article from 99 Designs has more detail on RGB and CMYK, including when to use them and how to check which colour mode your file is in Adobe programs.
