Gertrude Stein famously wrote, “A rose is a rose is a rose.” But in the age of digital and print media, this truism may no longer hold. A red rose may appear candy apple red on some screens, rusty red on others, and magenta when it prints. This is why it’s important to understand color codes. Which is primarily used for printed materials? Which are used in the digital world? And why?
There are four main color models that designers and printers use. And while to some, it may seem unnecessarily complicated to have so many systems to speak about colors, each one has it’s unique characteristic and purposes. Let’s take a look into each type of color model and what they are used for.
Colors Models for Print Media
CMYK – CMYK stands for cyan (a type of blue), magenta, yellow and keyline color (also known as black). In the CMYK color space, each number represents percentages of cyan, magenta, yellow and black. For example, the red of a red, red rose can be written as 0% cyan, 61% magenta, 72% yellow and 0% black.
Specifically, CMYK is great for printing because it approaches the making of a color with the premise of a white background — as most printing is done on white paper. For this reason it is called a subtractive color method, in that it “subtracts” the primary colors — red, yellow, blue — from white light to create the desired color.
Pantone – Pantone colors or Pantone Matching System (PMS) is a proprietary system created by Pantone, Inc. in 1963 by Lawrence Herbert. PMS assigns 1112 colors a number and name. The red, red rose in we were talking about above might be called Red 032 C in Pantone colors. This system gives all parties — clients, designers, manufacturers — a consistent way to talk about colors and it relies on CMYK when printing. A key feature of Pantone is the its color guides, an attractive way of displaying various hues — a go-to tool when looking for brand colors or other elemental design choices that require choice colors.
Colors for the Web and Digital Medias
HEX – Hexadecimal color, or hex for short, is color system that uses six digits (three bytes) to translate a color into the code used for building websites, like CSS and HTML. Byte 1 is the value for blue, byte 2 is the value for red, and byte three is the value for yellow. So what does a red rose look like in hex code? The bright red of a rose can be expressed as #FF6347.
RGB – Red. Green. Blue. Using the primary colors, just like one does when mixing paints, RGB is an additive color model. Adding red, green, blue to compose the desired color. One can think of RGB as the opposite of CMYK. Most digital screens from televisions to smart phones use RGB to display color, mixing the primary color in light to form a vast array of colors. So if we translate that rose once again, we might use rgb(255,99,71) to express a rose red.
So if we were to re-write Stein’s saying for today’s world, we might say “CMYK (0,6,72,0) is rgb(255,99,71) is #FF6347 is Red 032 C” which isn’t quite as catchy.
It’s important to know your brand colors in all their forms. If you only know your company colors in one color model, it’s fairly easy to find its translations to the other forms. Resources like Code Beautify offer quick conversion tool from hex to Pantone.
It’s a good idea to keep the codes written somewhere handy just in case a new web designer or printer needs to know the information.
Photo by Francesca Saraco on Unsplash
Jess Watson is the CEO & Creative Director of Points North Studio. She's the co-organizer of Baltimore Womxn in Tech, a big believer in Baltimore city, and a pioneer of working remotely while traveling the globe.
