When working with color in design, it’s essential to understand the difference between how color is displayed on screens versus how it’s produced in print. On digital devices, colors are typically represented in hexadecimal HTML color codes, while printed materials rely on the CMYK color model. Each system is built for a different medium and purpose.
Screen Color: RGB & Hexadecimal
Hexadecimal colors are based on the RGB color model—Red, Green, and Blue light combined in varying intensities. In HTML and CSS, colors are often written in 6-digit hex codes, like #BADA55, where each pair of characters represents one color channel. In this example, #BA represents 186 of a possible 255 units of Red. That’s roughly 73% of maximum. #DA is 218, or about 85.5% Green. And #55 = 85 in decimal, which is 33.33% of 255. Combined, Red and Green light make yellow, so this color will be a bright yellowish green:
This system uses 24 bits total: 8 bits each for red, green, and blue. That means:
2²⁴ = 16,777,216 distinct colors can be represented using 24-bit color—more than the human eye can typically distinguish.
For even more precision, modern formats support 32-bit color, which adds an 8-bit alpha channel for transparency. This allows designers to control not just color, but how opaque or transparent an element appears, enabling effects like layering, fading, and soft shadows on screen.
Print Color: CMYK
In contrast, printers use the CMYK color model—Cyan, Magenta, Yellow, and Key (Black). Unlike RGB, which is additive (light-based), CMYK is subtractive, mixing physical inks to absorb certain wavelengths of light. This means that colors in print are inherently different from those on a screen.
Printing processes such as offset printing, digital printing, or screen printing rely on CMYK values to produce consistent, high-quality results on paper. However, CMYK offers a smaller gamut of colors than RGB, which can lead to discrepancies when translating screen designs into print. That’s why designers often need to proof and adjust color profiles when preparing digital artwork for physical output.
Bridging the Gap
When designing across mediums, understanding the limitations and strengths of each color system is key. Hex codes give you incredible range and flexibility on screens—especially with added alpha transparency—while CMYK remains the standard for clear, consistent printing.
Color is more than just visual—it’s how we communicate tone, emotion, and brand identity. Using the right model for the right medium helps ensure your message stays vibrant, wherever it lives.
