RGB to CMYK Converter
Convert RGB screen colors to CMYK print colors. This conversion is essential when preparing digital designs for professional printing, as printers use CMYK (Cyan, Magenta, Yellow, Key/Black) ink.
Understanding the Conversion
RGB and CMYK are fundamentally different:
| Aspect | RGB | CMYK |
|---|---|---|
| Model | Additive (light) | Subtractive (ink) |
| Medium | Screens | |
| White | All colors combined | No ink |
| Black | No light | All colors or K ink |
RGB to CMYK Examples
| Color | RGB | CMYK |
|---|---|---|
| Red | rgb(255, 0, 0) | C:0 M:100 Y:100 K:0 |
| Green | rgb(0, 255, 0) | C:100 M:0 Y:100 K:0 |
| Blue | rgb(0, 0, 255) | C:100 M:100 Y:0 K:0 |
| Orange | rgb(255, 165, 0) | C:0 M:35 Y:100 K:0 |
Color Gamut Limitations
Some RGB colors cannot be reproduced in CMYK:
| RGB Color | CMYK Issue |
|---|---|
| Neon colors | Too bright for ink |
| Electric blue | Appears duller |
| Lime green | Shifts toward yellow |
Print Preparation Tips
1. Convert to CMYK early in the design process 2. Use Pantone colors for brand accuracy 3. Print proofs before final production 4. Ensure 300 DPI resolution for print
Use this converter when preparing digital designs for professional print production.
RGB and CMYK
| RGB | CMYK | |
|---|---|---|
| Syntax | rgb(255 99 71) in modern CSS, rgb(255, 99, 71) in the legacy comma form | cmyk(0%, 61%, 72%, 0%) β not valid CSS |
| Channels | red, green, blue β 0β255 or 0β100% | cyan, magenta, yellow, key (black), each 0β100% |
| Precision | 8 bits per channel as normally written; CSS accepts fractional values | Depends entirely on the ICC profile and the press |
| Support | Universal. The space-separated form needs a 2020-or-later browser. | Print only. Browsers have no CMYK colour type. |
| Best for | Programmatic colour manipulation, canvas work, image pixel data. | Print production. Always confirm against the printerβs own profile. |
A Worked Example
Taking CSS tomato through every format:
| Format | Value |
|---|---|
| HEX | #FF6347 |
| RGB | rgb(255, 99, 71) |
| RGBA | rgba(255, 99, 71, 0.5) |
| HSL | hsl(9, 100%, 64%) |
| HSB | hsb(9, 72%, 100%) |
| CMYK | cmyk(0%, 61%, 72%, 0%) |
What Gets Lost
RGB and CMYK do not cover the same gamut. Saturated screen colours β bright greens and oranges especially β have no CMYK equivalent and will come back duller in print. Treat the numbers below as a starting point and proof against the press profile.
Doing It in Code
``javascript
// HEX to RGB
const hexToRgb = (hex) => {
const n = parseInt(hex.replace('#', ''), 16);
return { r: (n >> 16) & 255, g: (n >> 8) & 255, b: n & 255 };
};
// RGB to HEX
const rgbToHex = (r, g, b) =>
'#' + [r, g, b].map((v) => v.toString(16).padStart(2, '0')).join('');
`
Modern CSS can do a lot of this without any conversion at all: color-mix() blends two
colours, and relative colour syntax β hsl(from var(--brand) h s calc(l + 10%))` β derives
a lighter shade without you ever computing one.