StringMash.com

CMYK to RGB converter

Cyan, magenta, yellow and black to rgb(), with the working.

Conversion
13 characters
Updates as you type
Hex#3366CC
RGBrgb(51, 102, 204)
HSLhsl(220, 60%, 50%)
HSV (HSB)hsv(220, 75%, 80%)
CMYKcmyk(75%, 50%, 0%, 20%)
Nearest CSS nameroyalblue
Contrast with white5.37:1 (AA)
Contrast with black3.91:1 (AA large text only)
The swatch and working are below

Show the steps
Aa blackAa white
  1. Each channel is 255 × (1 − (ink × (1 − K) + K)), with K = 0.2.
  2. Red from cyan 0.75: 51. Green from magenta 0.5: 102. Blue from yellow 0: 204. Rounded to whole numbers, that's rgb(51, 102, 204).
  3. Contrast: 5.37:1 against white and 3.91:1 against black, so white text reads better on it.

Using the converter

Type the four ink amounts in order, cyan, magenta, yellow and black, such as 75, 50, 0, 20. Percent signs are optional, and cmyk(75%, 50%, 0%, 20%) works as well.

The answer is an rgb() value for CSS or a design tool. Swap the boxes to go from RGB to CMYK instead. The rows give the hex code, HSL and the contrast with black and white text.

The CMYK to RGB formula

Each ink takes away one colour of light. Cyan takes red, magenta takes green and yellow takes blue, while black (K) darkens all three. So each screen channel is 255 × (1 − ink) × (1 − K), with the inks written from 0 to 1.

CSS Color 5 writes the same thing as 255 × (1 − (ink × (1 − K) + K)). Multiply out the brackets and the two forms are equal.

A worked example

Take cmyk(75%, 50%, 0%, 20%). As fractions that's C = 0.75, M = 0.5, Y = 0 and K = 0.2, so 1 − K = 0.8.

Red is 255 × (1 − 0.75) × 0.8 = 255 × 0.2 = 51. Green is 255 × 0.5 × 0.8 = 102. Blue is 255 × 1 × 0.8 = 204.

That gives rgb(51, 102, 204), which is #3366CC. Results that aren't whole numbers are rounded, so 0, 47, 100, 0 gives a green of 135.15 and the converter shows 135.

Common CMYK values in RGB

Inks in the order cyan, magenta, yellow, black, as percentages, with the plain formula.
ColourCMYKRGBHex
White0, 0, 0, 0rgb(255, 255, 255)#FFFFFF
Black0, 0, 0, 100rgb(0, 0, 0)#000000
Cyan100, 0, 0, 0rgb(0, 255, 255)#00FFFF
Magenta0, 100, 0, 0rgb(255, 0, 255)#FF00FF
Yellow0, 0, 100, 0rgb(255, 255, 0)#FFFF00
Red0, 100, 100, 0rgb(255, 0, 0)#FF0000
Green100, 0, 100, 0rgb(0, 255, 0)#00FF00
Blue100, 100, 0, 0rgb(0, 0, 255)#0000FF
Mid grey0, 0, 0, 50rgb(128, 128, 128)#808080
Orange0, 50, 100, 0rgb(255, 128, 0)#FF8000
Navy100, 100, 0, 50rgb(0, 0, 128)#000080
Brown0, 60, 100, 40rgb(153, 61, 0)#993D00
Mid blue75, 50, 0, 20rgb(51, 102, 204)#3366CC

Why the screen colour is only a guide

The formula assumes perfect inks on perfect paper, with every percentage of ink laid down exactly as the file asks and nothing spreading into the paper around it. Real cyan ink isn't the pure #00FFFF a screen shows, and paper soaks up and spreads ink, so a printed swatch and the RGB value will differ.

Printers convert with an ICC profile for their own press and paper. CSS Color 5 calls the formula here the naive conversion, for colours with no profile. For a colour that has to match, ask the printer for a proof. CMYK to hex gives the same result as a hex code.

Questions

Can I type CMYK as decimals?

Yes. 0.75, 0.5, 0, 0.2 reads the same as 75, 50, 0, 20. If any value is over 1, all four are read as percentages.

Why does RGB to CMYK and back change the colour slightly?

CMYK is rounded to whole percentages, and one percent of ink is about 2.5 steps of an RGB channel. A channel can come back one or two off.

What is 100% black in RGB?

rgb(0, 0, 0). With K at 100% the other inks make no difference to the formula.

Sources

Written, edited and reviewed by .

Added and reviewed . What's new