The W3C CSS Color 4 naive CMYK-to-RGB formula converts any four ink percentages into an 8-bit sRGB color using R = 255 × (1 − C) × (1 − K), G = 255 × (1 − M) × (1 − K), and B = 255 × (1 − Y) × (1 − K), and that resulting hex value is the only thing a WCAG contrast checker can read. CMYK is a subtractive, device-dependent model used by printers, where each percentage is the area coverage of cyan, magenta, yellow, or black ink on paper. RGB is an additive model used by screens, where each integer from 0 to 255 describes the brightness of red, green, or blue light. Accessibility contrast, defined by WCAG, is computed entirely in sRGB, so there is no WCAG formula that accepts CMYK input directly. That gap is exactly why a CMYK-to-RGB conversion step always sits in front of any accessibility check, whether the source is a brand book, a vendor proof, a printer quote, or a swatch copied out of a Photoshop file. The browser-based CMYK to RGB tool applies the naive formula above, so the moment you type in percentages you get a usable hex code that drops straight into a contrast checker.

cmyk to rgb accessibility contrast
cmyk to rgb accessibility contrast

What "CMYK to RGB Accessibility Contrast" Actually Means

The phrase ties three things together: a print color recipe expressed in CMYK ink percentages, an on-screen approximation in RGB, and a WCAG contrast check between that screen color and a background. The point is to make sure a print-derived color you intend to use in a web interface, a PDF form, an HTML email, or a poster preview still reads clearly when it lands on a display.

CMYK and RGB describe color in incompatible ways. CMYK is a device-dependent, subtractive model used by printers, where each percentage refers to how much cyan, magenta, yellow, or black ink covers a given area of paper. RGB is an additive, device-independent model that browsers, operating systems, and monitors use, where each channel describes the intensity of red, green, or blue light. Accessibility contrast, defined by WCAG, is computed entirely in the sRGB color space, so to evaluate a CMYK color for accessible text you must first convert it to an RGB value, then feed that value to a contrast checker. The CMYK to RGB tool turns four print ink percentages into a single sRGB hex value in one step, which you can then drop into the Color Contrast Checker to test against another color. For a broader look at when each color mode belongs in a project, the CMYK versus RGB print guide covers the surrounding decision in more depth.

The W3C Naive Device-CMYK Formula

The tool follows the W3C CSS Color 4 "naive" device-CMYK fallback — the same math the spec uses when a CMYK color has no associated ICC profile. The conversion treats each ink independently, folds in black as a multiplier on every channel, and rescales the result from a 0-to-1 float to a 0-to-255 integer. For each input, normalize the four percentages to 0–1 by dividing by 100, then compute each display channel as 255 × (1 − ink) × (1 − K), with any value above 255 clamped to 255. Half-even tie rounding serializes each result to an integer so the math matches the W3C firebrick example byte-for-byte. The W3C CSS Color 4 working draft documents this exact fallback and the endpoints the implementation is expected to honor.

Worked example: take CMYK = (15%, 75%, 10%, 25%). Normalized, C = 0.15, M = 0.75, Y = 0.10, K = 0.25.

  • R = 255 × (1 − 0.15) × (1 − 0.25) = 255 × 0.85 × 0.75 = 162.5625, which rounds to 163.
  • G = 255 × (1 − 0.75) × (1 − 0.25) = 255 × 0.25 × 0.75 = 47.8125, which rounds to 48.
  • B = 255 × (1 − 0.10) × (1 − 0.25) = 255 × 0.90 × 0.75 = 172.125, which rounds to 172.

The result is rgb(163, 48, 172), or #A330AC, a saturated violet. You can confirm the same numbers by entering the percentages into the CMYK to RGB tool directly. None of the intermediate products exceeded 1 in this case, so no clamping kicked in, and the simple product form of the formula is enough.

Convert CMYK to RGB in Your Browser

If you have four ink percentages from a design file, a brand spec, or a print quote, the fastest path to a screen-ready color is a single browser pass.

  1. Open the CMYK to RGB tool.
  2. Move the cyan, magenta, yellow, and black sliders to match your four percentages between 0 and 100.
  3. Read the three updated 8-bit RGB channels (0–255) shown beside the swatch.
  4. Copy the six-digit hexadecimal value from the hex field.
  5. Paste that hex into a contrast checker against your intended background or text color.

Every step happens locally in the browser. The tool does not load an ICC profile and does not transmit your percentages to a server, so vendor and brand-sensitive color recipes stay private while you convert them.

From RGB to an Accessibility Contrast Score

WCAG 2.x defines minimum contrast ratios for text against its background: 4.5:1 for normal body text at AA, 7:1 at AAA, 3:1 for large text at AA, and 4.5:1 for large text at AAA. All of these are computed in sRGB using a relative-luminance formula, which is why the CMYK-to-RGB step has to come first — a contrast checker cannot read a CMYK value directly. Once you have the hex code, paste it into the Color Contrast Checker alongside your background hex. The checker returns the ratio, flags pass or fail against AA and AAA for both normal and large text, and previews the combination in real time. If the ratio is too low, you can return to the CMYK tool, nudge the sliders, and re-test until the score is acceptable.

AspectNaive (browser tool)ICC profile-aware software
MethodW3C CSS Color 4 fallback formulaSource/destination profile mapping with rendering intent
SpeedInstant, fully in-browserSeconds, requires a profile asset and color-managed OS
AccuracyApproximation of an sRGB screen colorPrint-accurate to a calibrated device
Typical useUI mockup, palette preview, accessibility sanity checkPress proof, contract color, brand spec enforcement
RequiresOnly the four CMYK percentagesICC profiles, calibrated display, profile-aware application

The naive path is the right one for any task whose goal is to filter out obviously bad contrast candidates before printing, while the profile-aware path is the right one for any task where the printed color is the deliverable.

Familiar Endpoints You Can Predict

Because the formula is so simple, a handful of endpoints behave predictably and are worth memorizing as sanity checks:

  • CMYK (0, 0, 0, 0) — no ink at all — produces rgb(255, 255, 255), or pure white.
  • CMYK (0, 0, 0, 100) — full black — produces rgb(0, 0, 0), or pure black.
  • CMYK (0, 100, 100, 0) — full magenta and yellow, no cyan, no black — produces rgb(255, 0, 0), or pure red.
  • CMYK (100, 0, 0, 0) — full cyan only — produces rgb(0, 255, 255), or cyan.
  • CMYK (100, 100, 0, 0) — full cyan and magenta — produces rgb(0, 0, 255), or blue.

These match the endpoints the W3C spec calls out, and they give you a fast mental check that your inputs are reaching the tool in the right order and range before you trust the output for a contrast decision.

When the Naive Conversion Is Enough, and When It Is Not

The naive fallback is fast, predictable, and good enough for several real tasks: rough interface mockups where you need to know whether a print color "looks roughly right" on screen, palette comparisons across a deck, and accessibility sanity checks where the goal is to filter out obviously bad contrast candidates before any printing happens. The tool labels itself an approximation rather than a press proof, and that label matters. Real CMYK is device-dependent. The press, ink set, paper stock, dot gain, rendering intent, and embedded ICC profile can each shift the printed color noticeably. Profile-aware applications — Photoshop, Illustrator, Acrobat, InDesign — apply source and destination ICC profiles when converting between CMYK and RGB. The browser tool does not load a profile, so for any decision that affects contract color, customer approval, or press output, keep the original CMYK values, request the correct output profile from your printer, and run the conversion through profile-aware software on a calibrated display with a physical proof.

For accessibility work specifically, the implications are usually mild. The naive formula is a fair predictor of how an unprofiled print color will render on a typical sRGB monitor, so it catches the worst contrast failures early. A difference of one or two RGB points at a rounding boundary rarely moves a contrast ratio from "passes AA" to "fails AA." When the result is borderline, the right next step is to confirm the hex with a profile-aware conversion rather than to assume the naive answer is final.

A Practical CMYK-to-RGB Accessibility Workflow

Pulling everything together, here is the minimum viable workflow for checking a print-derived color for screen accessibility:

  1. Read the four CMYK percentages from your brand book, vendor spec, or print file.
  2. Open the CMYK to RGB tool and set cyan, magenta, yellow, and black to those values.
  3. Note the displayed hex code.
  4. Open the Color Contrast Checker with the hex on one side and your intended background on the other.
  5. Confirm the ratio meets WCAG AA at minimum — 4.5:1 for normal text, 3:1 for large text.
  6. If it fails, return to step 2 and adjust — raising black darkens every channel at once and typically improves contrast against a light background, while lowering saturation and adding black together tends to preserve hue while lifting the ratio.
  7. For production print, do not replace your original CMYK values with the converted hex. The hex is a screen-only reference.

That last point matters: many designers burn themselves by saving the converted hex into a print-ready file. CMYK is the language of press output, while RGB and hex are the language of screens. Keeping them separate is what protects both the printed result and the on-screen accessibility of the same brand.

If you're weighing options, How to Check Color Contrast in PowerPoint Slides covers this in detail.