Hex to CMYK Color Converter

What this tool does

You designed something on screen, picked your colours as hex codes, and now the print shop has asked for CMYK values. It is one of the most common little hurdles in design: the colour you see on a monitor and the colour a printer lays down in ink are described in completely different languages, and you need to translate between them.

That is what this does. You give it a hex code, and it returns the equivalent CMYK values, the four ink amounts a printer works with, ready to drop into your print settings or hand to whoever is producing the job. Below the tool there is a plain explanation of what CMYK is and why the printed result sometimes surprises you.

How to use it

1. Enter your hex code. Type or paste it into the field, with or without the leading hash, or use the colour picker to set one.
2. Read the CMYK values. The tool shows the matching cyan, magenta, yellow, and key (black) values straight away, each as a percentage.
3. Copy what you need. Take the four CMYK numbers for your print settings, and note the colour preview so you can see what you are working with.

Short three-character hex codes work as well as the full six, and the hash is optional. If you do not have a hex code to hand, set a colour with the picker and read its CMYK values from there.

How it works

The conversion happens in two steps, because hex and CMYK do not map to each other directly. First the hex code is read back into its red, green, and blue amounts, since a hex code is really just those three numbers written in a compact form. Then those RGB values are converted into the four CMYK ink amounts using the standard formula, work handled here by chroma.js, a colour library that knows how to move between colour models.

The maths itself is straightforward. The black channel, key, comes from whichever of red, green, or blue is brightest, and the cyan, magenta, and yellow amounts are then worked out from what is left. The result is a device-independent CMYK value, a sensible starting point that a print workflow can take and refine.

What CMYK actually is

CMYK is the colour model of printing, and it stands for the four inks a colour printer uses: cyan, magenta, yellow, and key, which is black. Each is given as a percentage from zero to one hundred, describing how much of that ink is laid down. Pure red, for example, is roughly no cyan, full magenta, full yellow, and no black.

The reason it works so differently from screen colour is that it is subtractive. A screen starts black and adds coloured light to build up to white, but ink starts with white paper and adds colour to take brightness away, each layer of ink absorbing more light. Stack enough ink and you approach black, which is also why printers carry a dedicated black: mixing the three colours to make black wastes ink and never looks truly dark, so key fills that gap.

How a hex code becomes CMYK

A hex code and a CMYK value can describe the same colour, but they come at it from opposite directions. The hex code is built for a screen, three pairs of characters standing for the red, green, and blue light a monitor emits. The CMYK value is built for paper, four amounts of ink that absorb light instead of emitting it.

Bridging the two means going through RGB as a middle step. The hex is unpacked into its red, green, and blue numbers, and from those the converter calculates how much cyan, magenta, yellow, and black ink would recreate that colour on paper. It is a clean piece of arithmetic, but it is also where the catch hides, because the two colour worlds do not cover quite the same range, which is the subject of a section further down.

Why convert hex to CMYK

The need almost always comes from the same place: a design that lived on screen now has to exist on paper. Web and digital work is built in hex, but business cards, packaging, posters, brochures, and signage are all printed in CMYK, so the moment a screen design heads to a printer, its colours have to be translated.

It matters most for brand colours, which have to look consistent everywhere. A company whose logo is a specific hex on its website needs the matching CMYK so the same colour appears on its printed materials. Converting the hex gives the print job a faithful starting point, rather than leaving the colour to be guessed at on press.

The print caveat worth knowing

Here is the part that trips people up. Screens can display more colours than ink can reproduce, so the range of CMYK is smaller than the range of hex and RGB. Very bright, saturated colours, electric blues, neon greens, vivid oranges, simply cannot be mixed from the four inks, so their converted CMYK values come out noticeably duller than they looked on screen. That is not a fault in the conversion; it is a real limit of printing.

So treat the CMYK value as an accurate technical starting point rather than a guaranteed match. The final printed colour also depends on the paper, the inks, and the printer's colour profile, which is why serious print work is checked with a proof, an actual sample printed before the full run. If a colour matters, convert it here, then confirm it on paper before committing.

Questions people ask

What is CMYK used for?

It is the colour model used in printing, naming the four inks a colour printer mixes: cyan, magenta, yellow, and key (black). Anything physically printed, from flyers to packaging, is produced in CMYK rather than hex.

Why does my colour look different when printed?

Because ink cannot reproduce every colour a screen can show. Bright, saturated colours fall outside the printable range and come out duller. The paper, ink, and printer profile also affect the result, so a proof is the only way to be sure.

Do I need to include the hash in the hex code?

No. The hash is optional here, and both the full six-character and the short three-character hex formats work, so you can paste a code in whatever form you have it.

Is the CMYK conversion exact?

It is a faithful, device-independent calculation, but not a guaranteed printed match, since real output depends on your paper, inks, and colour profile. Use it as a reliable starting point and confirm important colours with a proof.

References

1. World Wide Web Consortium (W3C), CSS Color Module Level 4. https://www.w3.org/TR/css-color-4/
2. CMYK color model, the subtractive model used in printing. Wikipedia. https://en.wikipedia.org/wiki/CMYK_color_model
3. chroma.js (Gregor Aisch). Documentation. https://gka.github.io/chroma.js/