Color Matching: Why Your Business Cards Don't Match Your Website (And How to Fix It)

<AcademyQuote> "Colour is a power which directly influences the soul." — Wassily Kandinsky. It also directly influences whether customers trust your brand. When your colours don't match, trust evaporates. </AcademyQuote>

Here's the most common complaint we hear at Printulu:

"My brand green looks amazing on my <a href="https://www.printulu.co.za/product/business-cards" class="internal-link text-[#007756] hover:text-[#005d42] underline font-medium">business card</a>, but on my website it looks completely different. What's going on?"

The answer is simple: <a href="/blog/clusters/artwork-prep" class="internal-link text-[#007756] hover:text-[#005d42] underline font-medium">CMYK</a> and RGB are different colour universes.

Let me explain — and more importantly, let me show you how to fix it.

The Science (Simplified)#

CMYK = Print Colours#

CMYK stands for Cyan, Magenta, Yellow, Key (Black).

When you print, ink gets layered on paper. Each ink absorbs some light and reflects the rest. The colours you see are the light that bounces back.

Key fact: CMYK can only reproduce about 60% of the colours the human eye can see.

RGB = Screen Colours#

RGB stands for Red, Green, Blue.

Screens emit light directly. Each pixel combines red, green, and blue light to create the colour you see.

Key fact: RGB can reproduce about 75% of visible colours — including many that CMYK can't.

The Overlap Problem#

Here's the issue: some colours exist in RGB but NOT in CMYK. Bright blues, vivid greens, neon colours — they look amazing on screen but can't be printed accurately.

<AcademyDadJoke> Why did the designer cry at the printer? Because their RGB blue came out as a sad CMYK grey. 😄 </AcademyDadJoke>

The Real-World Impact#

Let's say your brand colour is a vibrant teal:

If you designed your website using the RGB value and then printed business cards using the same numbers... they won't match. Because the printer interprets those numbers as CMYK, not RGB.

The Solution: Define Colours in BOTH Spaces#

Step 1: Choose Your Brand Colours#

Start with the colour you want. Use a tool like Coolors.co or Adobe Color.

Step 2: Get Both Values#

For each brand colour, define:

Brand Primary (Green):
- HEX: #007756 (for web/CSS)
- RGB: 0, 119, 86 (for screen/digital)
- CMYK: 70, 0, 100, 20 (for print)
- Pantone: 348 C (for professional print matching)

Brand Secondary (Dark):
- HEX: #1A1A2E
- RGB: 26, 26, 46
- CMYK: 85, 80, 40, 60
- Pantone: 296 C

<AcademyProTip> The Pantone Rule: If colour accuracy is critical (logos, brand colours), specify Pantone (PMS) colours for print. Pantone colours are mixed from a formula, not created by layering CMYK. They're more expensive but guarantee consistency. </AcademyProTip>

Step 3: Create a Brand Colour Sheet#

One page. Every colour. Every format. Share it with everyone who creates anything for your brand.

Step 4: Test Before You Print#

The proofing process:

1. Design in CMYK mode (not RGB) for print materials
2. Request a physical proof before the full print run
3. Compare the proof to your brand colour sheet
4. Adjust if needed (most printers allow 1-2 proof rounds)

For digital:

1. Use HEX values in your CSS
2. Test on multiple screens (phone, tablet, desktop)
3. Remember: screens vary. Your brand green looks different on an iPhone vs a Samsung vs a laptop

The Screen Variation Problem#

Here's something nobody tells you: no two screens display colours the same way.

An iPhone screen uses OLED technology. A budget Android uses LCD. A MacBook uses Retina. Each displays your brand colour slightly differently.

What you can do:

• 1Design for the average screen (sRGB colour space)
• 2Test on 3+ different devices
• 3Accept that perfect consistency across all screens is impossible
• 4Focus on consistency between your print and your most-used screen (usually mobile)

Common Colour Mistakes (And How to Avoid Them)#

Your Action Plan#

1. Audit your current brand colours — are they defined in both CMYK and RGB?
2. Create a brand colour sheet — one page, all formats
3. Share it with everyone — designers, printers, web developers
4. Test before every print run — request a physical proof
5. Accept screen variation — focus on consistency, not perfection

Need print materials with perfect colour matching? Order from Printulu