A CMYK color chart built from CSS code starts with the 148 opaque named-color keywords standardized by CSS, each one mapped to an exact sRGB HEX and RGB value. CSS itself does not declare CMYK values; every CSS color, including every named color, lives in the sRGB color space and is interpreted by browsers, printers, and operating systems as an sRGB triplet. That is why any "CSS to CMYK" chart is really a two-step reference: first you resolve the CSS keyword (or #RRGGBB value, or rgb() function) to an exact sRGB number, and then you convert that sRGB triplet to CMYK percentages for printing. The HTML Color Names Chart supplies the first half of that workflow. It contains every opaque CSS named-color keyword, including standardized aliases, and gives you the exact standardized HEX and RGB for each row. From there, you feed the resolved sRGB values into an RGB to CMYK converter to produce the printable percentages. This guide explains the chart, the lookup process, and how to bridge the gap between CSS code and a printable CMYK swatch.
What CSS Provides and What CMYK Means
The CSS Color specification defines colors in the sRGB color space. That means every CSS color value, whether you write a named keyword like "tomato", a hexadecimal like #ff6347, or a functional notation like rgb(255, 99, 71), resolves to a triplet of red, green, and blue channels on a 0–255 scale. Browsers render these triplets on screens, which are also sRGB devices. CMYK, by contrast, is a subtractive color model used by printers. It describes ink coverage as percentages of cyan, magenta, yellow, and black. Because the two color spaces describe color in fundamentally different ways, CSS has no native CMYK syntax and no CMYK keywords. There is no cmyk(0, 100, 100, 0) function in CSS, and there is no keyword that prints as a specific ink mix. Instead, every CMYK value associated with a CSS color must be derived by converting the color's sRGB triplet into the printer's CMYK percentages. The conversion is approximate, because sRGB describes emitted light while CMYK describes reflected light through ink, so two devices rarely reproduce the exact same physical color from the same numbers.
The 148 Opaque CSS Named Colors and Their Codes
The CSS Color 4 specification standardizes exactly 148 opaque named-color keywords. Each keyword maps to one lowercase six-digit hexadecimal value in the form #RRGGBB, and each hex value maps to one decimal rgb(r, g, b) function. The HTML Color Names Chart is built directly on this standard. It lists every keyword as its own row, alongside its HEX, its decimal RGB, and a rendered sRGB swatch so you can see what the numbers actually look like. Standardized aliases appear as separate rows rather than being merged, because each spelling is a valid CSS identifier on its own. Aqua and cyan both map to #00ffff. Fuchsia and magenta both map to #ff00ff. Several gray-family names exist in both American and British spellings, such as gray and grey, with identical mappings. Two keywords are deliberately left out of the 148 count: transparent, which represents transparent black and is not an opaque swatch, and currentColor, which inherits from an element's computed color property and has no fixed standalone value. Keeping those outside the opaque table prevents a misleading numeric mapping.
How to Look Up a CSS Named Color and Copy Its Code
Follow these steps to find a CSS named color and copy its exact HEX value with the HTML Color Names Chart.
- Open the HTML Color Names Chart in your browser.
- Type part of a CSS color name into the filter to narrow the table. Keyword search is case-insensitive and matches name fragments, so typing "medi" brings up mediumblue, mediumorchid, mediumpurple, mediumseagreen, mediumslateblue, mediumspringgreen, mediumturquoise, and mediumvioletred in one pass.
- To resolve a specific #RRGGBB value, type the hash and the six digits into the filter. A search beginning with # uses exact HEX matching, so a partial value returns no matches rather than a guessed one.
- To resolve an rgb() value, type the complete rgb(r, g, b) string. A complete rgb() search also uses exact matching, so a short numeric fragment cannot accidentally match an unrelated channel value in another row.
- Review the matching row. Each row shows the standardized CSS keyword, the lowercase #RRGGBB value, the decimal rgb(r, g, b) value, and a rendered sRGB swatch.
- Click the HEX cell to copy the lowercase #RRGGBB value to your clipboard. The chart only reports success after the browser confirms the clipboard write.
- If clipboard permission is denied, the visible keyword, HEX, and RGB text remain selectable for manual copying; no hidden format is written.
- Clear the filter to restore all 148 rows in ASCII alphabetical order.
Search results preserve the specification table order, which is ASCII alphabetical by keyword in this implementation. The filter never changes a mapping, merges aliases, invents fuzzy synonyms, or converts the color to another color space. A no-match message is shown rather than substituting a nearby color.
From CSS Code to CMYK: A Two-Step Workflow
To turn a CSS color reference into a printable CMYK percentage, you resolve the CSS value first and then convert it. Start with the HTML Color Names Chart to confirm the standardized sRGB numbers behind a name, a HEX value, or a complete rgb() function. Once you have the exact RGB triplet, pass it to an RGB to CMYK conversion step, such as the RGB to CMYK Converter, to read off the four ink percentages. The chart runs entirely in the browser and does not send searches or copied values to a server, so you can look up names safely before sending them through any conversion step. Two caveats apply to every CSS-to-CMYK workflow. First, the conversion is mathematical, not perceptual; the resulting CMYK numbers describe what a printer should attempt to reproduce, not what your eye will see on press. Second, a CMYK value derived from a CSS color depends on the conversion profile in use; different tools and ICC profiles produce slightly different percentages for the same sRGB triplet, so always confirm the conversion profile with your print provider before signing off on a job. Color names themselves are historical identifiers, not a perceptually even palette or a guarantee that any display reproduces a physical pigment, so treat the names as convenient labels for sRGB triplets and treat the CMYK numbers as one possible translation.
Sample CSS to CMYK Mappings for Common Colors
The table below shows a few well-known CSS named colors with their standardized HEX from the chart and the CMYK values derived from a simple RGB-to-CMYK conversion (K = 1 - max(R,G,B)/255). These are reference starting points for screen-to-print planning, not exact press output.
| CSS Name | HEX | RGB | CMYK (%) |
|---|---|---|---|
| black | #000000 | rgb(0, 0, 0) | 0, 0, 0, 100 |
| white | #ffffff | rgb(255, 255, 255) | 0, 0, 0, 0 |
| red | #ff0000 | rgb(255, 0, 0) | 0, 100, 100, 0 |
| lime | #00ff00 | rgb(0, 255, 0) | 100, 0, 100, 0 |
| blue | #0000ff | rgb(0, 0, 255) | 100, 100, 0, 0 |
| yellow | #ffff00 | rgb(255, 255, 0) | 0, 0, 100, 0 |
| cyan | #00ffff | rgb(0, 255, 255) | 100, 0, 0, 0 |
| magenta | #ff00ff | rgb(255, 0, 255) | 0, 100, 0, 0 |
For every other CSS named color in the 148-row chart, run the same conversion against its HEX or RGB values with a dedicated RGB to CMYK tool rather than trying to memorize a chart by hand. There are 148 rows to cover, and the conversion depends on the profile you choose.
Why CSS Has No Native CMYK, and What That Means for Print
CSS Color is a screen-oriented standard. The specification defines colors in sRGB, a color space designed for monitors, phones, and televisions, and it provides named keywords, hexadecimal notation, functional rgb() and hsl() notation, and the lab(), lch(), color(), and oklch() notations that all resolve to a defined color space. CMYK is intentionally absent from CSS because CMYK depends on the ink, paper, and press profile being used, and there is no single CMYK that meaningfully describes a color across all printing devices. A CMYK value is only meaningful in the context of a specific ICC profile and a specific output device. When you publish a stylesheet for the web, you do not need CMYK values; the browser renders the sRGB numbers directly. When you send a design to a printer, the printer or prepress software converts your sRGB numbers into the press's CMYK profile. This is why the recommended workflow starts with the CSS name or HEX, uses the HTML Color Names Chart to confirm the exact standardized numbers, and then applies the appropriate conversion step for your chosen profile.
When to Use Named Colors, HEX, or RGB in CSS
Within CSS itself, you can use a named-color identifier anywhere the property grammar accepts a color value. That includes background-color, color, border-color, fill, stroke, box-shadow, text-shadow, and gradient stops, subject to the specific syntax of each property. Named colors are readable in prototypes and design discussions, but they are not a perceptually even palette, so neighboring names can look surprisingly similar and the names do not describe relative lightness consistently. HEX and rgb() notations express the same sRGB values more compactly or more explicitly, and they are interchangeable with named colors whenever a CSS property accepts a color. For a stylesheet that will only ever render on screens, choose whichever notation you find easiest to maintain. For a stylesheet whose assets will eventually move into print, prefer HEX or rgb() so that the exact sRGB triplet is visible in the file, and keep the HTML Color Names Chart handy as a reference for the standardized mappings behind every named keyword. For accessibility decisions, the color name alone is not enough; contrast depends on the foreground and background pair, the text size, the weight, and the applicable guidance, so use a dedicated contrast checker for that part of the work rather than relying on a named color's perceived lightness.
Related reading: RGB to CMYK in Photoshop: Faster Than Color Mode.