CMYK is the color model of print. It describes a color as four ink amounts laid on white paper: cyan, magenta, yellow, and key, which is black. Each value is a coverage percentage, how much of that ink the press puts down. With all four at zero nothing prints and you see bare paper; as the numbers rise the inks absorb more of the light bouncing off the page and the color darkens. It is subtractive, the opposite of the additive red, green and blue a screen glows, which is why the same color needs different numbers for print than for a monitor.

Why does CMYK have a K (black) channel if it already has cyan, magenta and yellow?

In theory the three colored inks at full strength should absorb all the light and leave black. In practice they leave a muddy brown, because real inks are not perfectly pure and three wet layers never register exactly. So presses add a dedicated black ink. It prints a true black the colors cannot reach, it deepens shadows without flooding them with costly colored ink, and it keeps small black text sharp instead of fringed by three slightly misaligned layers. It is called key because the other three inks are lined up, registered, against it.

What is the difference between CMYK and RGB?

They run in opposite directions. RGB is additive: a screen starts black and adds red, green and blue light until it reaches white, so more light means a brighter color. CMYK is subtractive: paper starts white and adds ink that removes light until it reaches black, so more ink means a darker color. RGB also covers a wider range, because glowing light can be more vivid than reflected ink. The neon colors a monitor shows often have no CMYK recipe that matches them, which is why bright screen designs look calmer once they are printed.

Can I use CMYK in CSS or on the web?

No. There is no cmyk() function in CSS, because the web paints with light and CMYK paints with ink, and a browser has no press to send the numbers to. CMYK lives in the files that do reach a press: design tool swatches, PDF color fields, printer setups. On the web you keep the color as hex or rgb and treat its CMYK build as the print-ready twin. To move between them, convert: read a hex code as ink percentages when a color has to be printed, and read ink percentages back to hex when a printed color has to go on screen.

CMYK: How Four Inks Print Every Color

The color code cmyk(0% 63% 36% 0%) is an order for a printing press. Lay down no cyan, a strong dose of magenta, a little yellow, no black, all onto white paper. What comes back is the hot magenta #FF5FA2 that washes down a Miami avenue after dark, the pink glowing off the wet asphalt and the neon along the strip. And a Miami night is the right place to start, because it reads like a print shop's ink drawer switched on: a cyan #00D1C1 in the palm light, a magenta #FF5FA2 down the middle of the road, a yellow #F8D273 from the low retro sun, the same three inks a press mixes every other color from. Every notation so far has described light glowing out of a screen, which is exactly what that skyline is doing. CMYK is the only one that describes ink sitting on paper, and it reads backwards from all of them: you do not add color, you take it away.

What CMYK Actually Is

CMYK stands for cyan, magenta, yellow and key, and those four inks are its whole vocabulary. Each value is a coverage percentage, how much of that ink the press lays on the page. Set all four to zero and nothing prints: you are looking at bare white paper. Turn one up and that ink starts drinking its share of the light bouncing off the sheet. Cyan absorbs red, magenta absorbs green, yellow absorbs blue. Stack them and the paper reflects less and less, sliding toward dark. Key is the black ink that finishes the job the other three cannot.

That is the reverse of a screen. A monitor starts black and adds red, green and blue light until it reaches white, so more light makes a brighter color. Paper starts white and adds ink until it reaches black, so more ink makes a darker one. One builds color out of light in a dark room, the other carves it out of a white one. The flamingo pink a screen makes by shining a lot of red and some blue, a press makes by holding back green with magenta and dimming blue a touch with yellow, then letting the red the paper still reflects shine through.

Starting From White

The four sliders below all start at zero, on bare paper. The left swatch holds that white paper and never moves; the right one is the print. Drag any ink up and the print pulls away from the paper toward dark, because every ink you add is light you take away. That is the whole model, and it is why the panel darkens as you work instead of brightening.

Add any ink and the print darkens away from the white paper it started on. Push all four high and the sheet runs out of light to give back.

Why the Black Ink Exists

The three colored inks should, on paper, make black by themselves: pile cyan, magenta and yellow at full strength and each drinks its channel of light until none is left. In the real world they make a muddy brown instead, because no ink is perfectly pure and three wet layers never line up exactly. So a press carries a fourth ink made only for darkness. Key prints a true black the colors cannot reach, it deepens shadows without flooding them with expensive colored ink, and it keeps small black text crisp instead of haloed by three slightly offset layers. It is called key because the other inks are registered, lined up, against it. That last letter is the one that makes a page look printed rather than smeared.

What the Screen Cannot Print

Here is the wall every designer hits. The Miami night at the top of this page is lit from within, every window and neon tube glowing straight at you; ink on paper can only bounce back the light already in the room, and it always bounces back a little less. Run that same scene as a poster on a press and it comes home a quieter place, the neon dimmed to whatever the ink can reflect. So the most electric screen colors, the neons and the acid greens, have no ink recipe that reaches them. #FF5FA2 on a screen is louder than the same code pressed onto a flyer, and no dial closes the gap, because ink cannot out shout a backlight. This is why a brand color often carries two definitions, a bright one for screens and a slightly calmer CMYK build for print, and why proofing a design on real paper before the run is never wasted time.

Writing CMYK

CMYK is the one model on this page with no home in CSS. There is no cmyk() function, because the web paints with light and CMYK paints with ink, and a browser has no press to send the numbers to. It lives instead in the files that do reach a press: the swatches in a design tool, the color fields of a PDF, the setup screen of a printer. On the web you keep the color as hex or rgb and treat its CMYK build as the print-ready twin on the line beside it.

Moving between the two is a paste away. The HEX to CMYK converter reads any hex code as its four ink percentages, the CMYK to HEX converter mixes four inks back into a hex code with the math shown on the page, and the color tool lists the CMYK build beside every other notation for any color you hand it.

Codigrate's Miami theme wears the whole idea on its sleeve: a cyan, a magenta and a yellow pulled straight from a print drawer and set glowing on a dark editor, the three inks doing on screen what they were named to do on paper. The next time a color has to leave the screen and land on something you can hold, read it in ink first: how much cyan, how much magenta, how much yellow, and how much black to make it real.