CMYK to HEX in Two Steps: Digitising a Print Spec
Print specifications outlive the jobs they were written for. A brochure from five years ago, a packaging spec sheet or a supplier's swatch often records a brand colour only as a CMYK build, and sooner or later that colour is needed in a presentation, an email signature or a social media template, where the format every tool accepts is a hex code. A CMYK to HEX conversion is the quickest bridge between the two worlds.
It takes two conversions, one from ink to light and one from decimal to hexadecimal. For C:0 M:92 Y:77 K:22:
- Work out how much light the black ink leaves: 100% − 22% = 78%, or 0.78.
- Red is limited by cyan: 255 × 1.00 × 0.78 = 198.9, so the red channel becomes 199.
- Green is limited by magenta: 255 × 0.08 × 0.78 = 15.9, so the green channel becomes 16.
- Blue is limited by yellow: 255 × 0.23 × 0.78 = 45.7, so the blue channel becomes 46.
- Write each channel in base 16 — 199 is C7, 16 is 10 and 46 is 2E — giving
#C7102E.
The second conversion is exact; the first is not. Every limitation of turning a print build into screen colour is already baked in by the time the hex digits are written, which is why most of this page is about the first step. For the decimal-to-hex arithmetic on its own, the RGB to HEX converter works through it channel by channel.
Where the HEX Code Ends Up
Almost every digital destination for a brand colour accepts hex, but each one has quirks worth knowing before you paste the value in.
- Presentations. Google Slides takes a hex code in its Custom color dialog, and recent versions of PowerPoint and Keynote accept one as well. Define the colour once in the theme or master slide rather than on individual shapes, so a later correction reaches every slide.
- Email signatures. HTML email is rendered by many different clients, so write colours as six-digit hex values in inline styles. Some clients apply their own dark-mode treatment and may lighten or invert text and backgrounds, so send yourself a test in dark mode before rolling a signature out.
- Social media templates. Canva and similar editors accept hex codes directly. Platforms recompress uploaded images, which can nudge flat brand colours slightly, and exporting graphics as PNG rather than JPEG usually keeps solid areas cleaner.
- Websites and apps.A converted value is a fine starting point for a colour token, but say in the token's description that it came from a print build, so nobody later mistakes it for the brand's specified screen colour.
- Video and motion graphics. Editing tools accept hex or RGB values, but video delivery often uses a limited 16–235 range and its own colour standards, so check brand colours in the exported file rather than only inside the editor.
The Accuracy Ceiling
A CMYK to HEX conversion can never be more accurate than the build it starts from, and in practice it falls short in three ways:
- The formula ignores the printing process. It treats paper as pure white and every ink as ideal, so the hex code describes a cleaner, brighter colour than the printed original.
- Percentages are coarse. Builds are written in whole percentages, giving each ink 101 steps against 256 per screen channel, so neighbouring builds can share a hex code and a round trip can shift a colour by a level or two.
- Different builds can share one screen colour.
C:30 M:30 Y:30 K:0andK:30on its own both convert to#B3B3B3, and flat and rich black both become#000000, even though each pair prints very differently.
How far off the result lands depends on the colour. Light, pastel builds with little black usually convert well, because paper white dominates and small ink percentages translate cleanly. Dark, heavily inked builds and saturated brights fare worst: the first lose the depth they had on paper, and the second can come out far more vivid on screen than anything the press produced.
For decorative uses that is usually good enough. When the colour carries brand meaning, treat the result as provisional and check it against the printed piece or, better still, against a Pantone reference.
Greys and Black Text From Print Specs
Print specifications often describe text and rules as black-ink tints rather than full colours: body copy at K:100, captions at K:70, hairlines at K:40. Converted directly, those tints become neutral greys, and the table shows how each one performs as text on a white screen.
| Black ink | HEX | RGB | Contrast on white | Normal text |
|---|---|---|---|---|
| K:10 | #E6E6E6 | rgb(230, 230, 230) | 1.25:1 | Below 4.5:1 |
| K:20 | #CCCCCC | rgb(204, 204, 204) | 1.61:1 | Below 4.5:1 |
| K:30 | #B3B3B3 | rgb(179, 179, 179) | 2.10:1 | Below 4.5:1 |
| K:40 | #999999 | rgb(153, 153, 153) | 2.85:1 | Below 4.5:1 |
| K:50 | #808080 | rgb(128, 128, 128) | 3.95:1 | Below 4.5:1 |
| K:60 | #666666 | rgb(102, 102, 102) | 5.74:1 | Passes 4.5:1 |
| K:70 | #4D4D4D | rgb(77, 77, 77) | 8.45:1 | Passes 4.5:1 |
| K:80 | #333333 | rgb(51, 51, 51) | 12.63:1 | Passes 4.5:1 |
| K:90 | #191919 | rgb(25, 25, 25) | 17.58:1 | Passes 4.5:1 |
| K:100 | #000000 | rgb(0, 0, 0) | 21.00:1 | Passes 4.5:1 |
K:54 is the lightest black tint that still reaches 4.5:1 against white, the WCAG minimum for normal-sized text. Lighter tints, which look perfectly legible as fine print on paper, can fail on screen, so a caption colour taken straight from a print spec may need darkening before it is used for web text.
Pure black text converts to #000000, which some designers find harsh on bright displays. A dark grey such as the K:80 or K:90 rows is a common alternative and passes easily, but make it a deliberate choice recorded in the design system rather than an accident of conversion. Printed tints also tend to darken as dots spread on press, so a K:50 caption on paper can look heavier than #808080 does on screen.
When to Go Through Pantone Instead
Many print specs record a CMYK build that was itself a stand-in for a spot colour, and older brand guidelines often pair a PMS number with a build on the same line. If the spec names a Pantone colour, ignore the build for screen purposes and take the screen value from the Pantone reference: Pantone to HEX and Pantone to RGB return the values recorded in our library.
If the spec gives only a build, CMYK to Pantone shows which ink it most likely approximates, and our guide to converting CMYK to Pantone explains how to judge whether that match is close enough. When all you have is a printed sample, Image to Pantone can suggest candidates from a photo, although a spectrophotometer reading of the sample is far more reliable than any camera. And if the closest Pantone match scores poorly, that is useful information too: the build probably was not imitating a spot ink, and the converted hex code is as good a starting point as you will get.
Keeping Digitised Colours Consistent
The first CMYK to HEX conversion is the easy part. Keeping the result stable across teams, templates and tools takes a little discipline:
- Record the source next to the value. A palette entry that reads “#C7102E, converted from C:0 M:92 Y:77 K:22” tells the next person the code was derived rather than specified.
- Keep one shared palette. Whether it is a design-system file, a brand portal or a simple spreadsheet, link to it instead of pasting values into individual documents.
- Name colours by role. Tokens such as brand-red or text-muted survive a later correction far better than a hex code copied into dozens of files.
- Re-check after every change. If the print build is revised, decide deliberately whether the screen value should follow, and update both together.
- Audit templates now and then. A periodic comparison of the shared palette against live slide, email and social templates catches drift before it spreads.
For the model underneath all of this, what CMYK is explains how four inks build a colour from dots, and the CMYK to RGB converter gives the same result in rgb() form when a tool asks for channels instead of a code.