StringMash.com

RGB to CMYK converter

rgb() values to print ink percentages, with the working.

Conversion
17 characters
Updates as you type
Hex#3366CC
RGBrgb(51, 102, 204)
HSLhsl(220, 60%, 50%)
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. Divide each channel by 255: red 0.2, green 0.4, blue 0.8.
  2. Black (K) is 1 minus the largest of those: 1 − 0.8 = 0.2, so 20%.
  3. Each colour ink is (1 − channel − K) ÷ (1 − K). Cyan = (1 − 0.2 − 0.2) ÷ 0.8 = 0.75, so 75%.
  4. Magenta from green: 0.5, so 50%. Yellow from blue: 0, so 0%.
  5. This is the plain screen formula. A print shop converts with its own colour profile, so the inks it uses will differ a little.
  6. Contrast: 5.37:1 against white and 3.91:1 against black, so white text reads better on it.

Using the converter

Type three numbers from 0 to 255, such as 51, 102, 204, or paste rgb(51, 102, 204) straight from CSS. The CMYK values appear as you type.

Below them are the hex code and HSL. There is a swatch too.

The RGB to CMYK formula

Divide each channel by 255. Then K = 1 − max(R, G, B), and each ink is C = (1 − R − K) ÷ (1 − K), with M from green and Y from blue in the same way. When K is 1 the colour is pure black and the other three are 0.

For rgb(51, 102, 204) that gives 0.2, 0.4 and 0.8. K is 1 − 0.8 = 0.2. Cyan is (1 − 0.2 − 0.2) ÷ 0.8 = 0.75, magenta (1 − 0.4 − 0.2) ÷ 0.8 = 0.5 and yellow 0, so cmyk(75%, 50%, 0%, 20%).

Why the printer may not match

Screens make colour by adding light. Printers take it away, laying four inks over white paper. The two can't reach all the same colours, so a bright screen orange or electric blue often prints duller.

The formula here is the simple one that knows nothing about your paper or press. It is the "naive" conversion the CSS Color specification describes for colours without a profile. A print shop uses an ICC colour profile for its own press instead, and the numbers it picks will differ a little, especially in deep blacks. Use these values as a starting point, and ask the printer for a proof when the colour really matters.

Questions

Why are my CMYK numbers different from Photoshop's?

Photoshop converts through a colour profile for a particular press and paper, such as a coated stock. This page uses the plain formula with no profile, so it won't match exactly.

Is CMYK 0 to 1 or 0 to 100?

Either. Print forms usually use percentages, and CSS uses 0 to 1. The values here are percentages.

Sources

Written, edited and reviewed by .

Added and reviewed . What's new