Your guide to understanding the subtle colour changes that you might experience with a variety of marketing materials, whether digital or printed.
If you’re staring at your brand guidelines wondering why your logo colour looks different on the PDF to how it looks on your building signage or your freshly printed promo pens, there’s good reason.
Why is there a difference between screen and print colours? Well, the short answer is because of the fundamental differences between the colour models used for digital and print formats. Understanding these differences can help you to achieve better colour consistency across all of your marketing materials.
What is the difference between RGB, CMYK and HEX?
When working with digital and print designs, understanding colour models is essential to maintaining consistency across different mediums. RGB, CMYK, and HEX are the three most commonly used formats, each serving a specific purpose. RGB is used for digital screens, CMYK is essential for print, and HEX codes are a web-friendly way of representing RGB colours.
Let’s delve a bit deeper…
Understanding RGB (Red, Green, Blue)
RGB is the colour model used for digital screens such as websites, social media and assets like banners or PDFs. Taking 3 light beams (one red, one green, one blue), the required colour is superimposed onto a screen using varying intensities of the three beams. It sounds highly technical, but you might be familiar with selecting colours in the Adobe suite and using a slider to alter the intensity of each colour, leading to one eventual colour that best resembles the shade you were looking for – simple!
What we aim to achieve in your brand guidelines is consistency; so instead of picking the colour that most resembles what you’re looking for each time, we pick the closest RGB colour mix and commit to it for all digital use.
Understanding CMYK (Cyan, Magenta, Yellow, Black)
CMYK is the colour model used for printing items such as brochures, posters and business cards. Unlike RGB, which uses light, CMYK combines ink to create colours.
CMYK starts with white (paper) and subtracts colours by layering ink. A printing press uses dots of ink to build up colour – the more ink you add, the darker the colour.
Understanding these differences is important to make sure you use the right colour model for what you need – simply using one for all will result in discrepancies and a lack of consistency across your brand.
For comparison purposes, if we took a bright blue shade from the RGB colour model, it may not look as bright in CMYK because it would need to be created using a mixture of cyan and magenta inks, and they can struggle to reproduce bright/neon-like hues.
Understanding HEX (Hexadecimal)
HEX codes are a way of representing RGB values in a format commonly used for web design. Unlike RGB, which is expressed as three separate values (e.g., RGB 255, 87, 51), HEX condenses this information into a six-digit code, making it easier to use in web development. It also ensures colour consistency across different browsers and devices, so it’s really important if you want all website visitors to see the same colour, no matter how they access your website.
Is there another option? Let’s talk about Pantone.
Pantone (PMS – Pantone Matching System) is a standardised colour matching system used primarily in print. Unlike CMYK, which mixes inks to create colours, Pantone colours are pre-mixed, ensuring consistency across different materials and printers.
Instead of layering inks, Pantone colours are applied as a single, solid colour. This is known as the Spot Colour System, and is commonly used in packaging and high-quality print materials. A Pantone colour will always look the same across different print jobs, whereas a CMYK equivalent may vary slightly.
Why colours appear different across mediums
There can be a number of reasons why colours might appear differently across different applications. This section might help you to troubleshoot why you are experiencing a difference in the appearance of your colours:
Different colour gamuts
A gamut refers to the range of colours within the colour spectrum. As we’ve explained in the sections above, depending on which model you’re working with, you may experience a different range of capabilities. For example, RGB has a broader range of colours (gamut) compared to CMYK. Some vibrant colours that are visible on screens might not be accurately reproduced in print, using the CMYK model.
You should take this into account when selecting brand colours or designing materials that will regularly be reproduced in print and digital formats.
Material differences
If you’ve ever ordered print before, you’ll know that you’re often given a choice of material finishes such as paper type, finish (glossy or matte), and the printing process used. It’s always important to note that digital screens use backlit displays, making colours appear more vibrant than they might be on your finished product.
Due to the nature of the differences in materials, a screen printed t-shirt and a flyer may look completely different. When building a brand, it’s important to consider all possible applications so that you can ensure as much consistency as possible, however, due to the different processes it may never be 100% accurate.
Calibration and Settings
When was the last time you calibrated your computer screen? (Confession, this writer has never done it.) Everything from manufacturer settings to brightness can impact how a colour might appear on screen for you. That means, we could create artwork for you in our studio and send it over to you, where it may look slightly different on your screen. It’s also worth noting that if you choose to print it out to view it, your printer calibration settings and its colour model setup will change how it looks.
Our advice? Before embarking on a print project, try to have a basic understanding of the differences between print processes and ensure your screen and printer have been calibrated. If you’re ever unsure – speak to an expert!
How to achieve better colour consistency
Understanding the different colour formats and processes is a great start to achieving colour consistency across your marketing materials. Here’s our top tips to achieving the best possible colour consistency:
- Use the appropriate colour profiles – when designing materials, make sure your colour formats are set up correctly. Using RGB for digital materials and CMYK for print is a good start.
- Check print proofs – a good printer will always supply you with a print proof to compare your colours (amongst other checks) before committing to full production.
- Try to have a brand guardian who knows your guidelines inside and out – make sure they sign off all uses.
- Calibrate! Ensure all digital screens are calibrated to industry standards. Check laptops, computer screens and printers.
- If in doubt, work with Pantone colours – as the Pantone matching system provides standardised colours, you can use this to achieve the right brand colours across print materials.
There won’t be a quiz later, but we’ve answered some commonly asked questions below – just in case!
Q: Why does my printed logo look duller than on my website?
A: Print uses CMYK, which has a smaller colour gamut than RGB. Some colours, especially bright or neon shades, won’t look as vibrant.
Q: Can I use RGB for printing?
A: No, print files must be converted to CMYK. If you send an RGB file to a printer, the colours may shift unexpectedly.
Q: How can I make my brand colours consistent across digital and print?
A: Work with designers who understand colour conversion and use Pantone colours for branding, if possible.
Q: What’s the best way to match my website colours to my printed materials?
A: Find the closest CMYK or Pantone equivalent of your RGB/HEX colours and test printed samples before finalising.
