A CMYK color chart for DTF printing can be built from the 148 standardized HTML color names by looking up each CSS keyword, copying its exact HEX value, and converting that HEX into CMYK percentages for your print file. DTF (Direct-to-Film) printing lays down cyan, magenta, yellow, and black ink on a transfer film, then heat-presses that film onto fabric, which means every artwork sent to a DTF press needs a CMYK breakdown — yet most design tools store color as HEX or RGB. The HTML Color Names Chart bridges that gap with a verifiable, standardized list of 148 named colors and their exact six-digit HEX and decimal rgb() coordinates, all defined in the W3C CSS Color 4 specification. Because the keywords are specification-based, the values stay consistent across browsers, RIP software, and design apps, which matters when a print shop, a designer, and a client all need to agree on "the same red" without shipping physical swatches. Standardized aliases such as aqua and cyan (both #00ffff) and fuchsia and magenta (both #ff00ff) appear as separate valid identifiers so legacy stylesheets translate cleanly. Each row shows a rendered swatch, the lowercase HEX, and the rgb(...) tuple, and clicking the HEX writes it to your clipboard for paste into your design tool.

cmyk color chart for dtf printing
cmyk color chart for dtf printing

Why DTF Printers Need a Stable Reference Chart

DTF printing reproduces artwork by laying down cyan, magenta, yellow, and black ink on a transfer film, then heat-pressing the film onto a garment. The on-screen HEX you pick in a design application does not reach the press directly — the RIP software has to translate that sRGB value into an equivalent CMYK dot pattern, and any drift in the conversion can shift a brand color or break a gradient. A stable reference chart acts as a single source of truth: every person touching the file (designer, prepress operator, print shop) sees the same HEX and the same intended CMYK percentage rather than guessing from memory. When you build your DTF palette from a named, standardized list rather than ad-hoc swatches, you also avoid the risk of one tool rounding a channel value slightly differently from another. The chart's 148 rows are locked by invariants — exact row count, unique keywords, six lowercase hexadecimal digits per value — so the dataset you reference today matches the dataset you reference next month.

What the HTML Color Names Chart Contains

The chart lists every opaque named-color keyword defined in CSS Color 4 — exactly 148 rows, with standardized aliases kept as separate valid identifiers. Each row contains one CSS keyword, one lowercase six-digit HEX value, one decimal rgb(r, g, b) tuple, and a rendered swatch so you can verify what the keyword actually looks like in your browser. All listed colors resolve in the sRGB color space, which is the same color space your design application and most DTF RIP software use as their starting point for CMYK conversion. The chart deliberately excludes transparent and currentColor from the 148-row count: transparent represents transparent black rather than an opaque swatch, and currentColor inherits from an element's computed color, so neither has a single fixed HEX. Keeping those values outside the opaque table prevents a misleading numeric mapping when you copy a color into your DTF job. Search results preserve the specification table order, which is ASCII alphabetical by keyword in this implementation, and filtering never changes a mapping, merges aliases, invents fuzzy synonyms, or converts the color to another color space.

How to Build a CMYK Color Chart for DTF Printing from HTML Names

  1. Open the HTML Color Names Chart in your browser; the tool runs entirely client-side and does not send any input to a server.
  2. Filter by the design palette you need for the DTF job: type a keyword fragment such as "red", "blue", "dark", "light", or "gray" to narrow the 148 rows to a relevant subset.
  3. For each row you want to include in your DTF palette, click the lowercase HEX value to copy it; the chart reports success only after the browser confirms the clipboard write.
  4. Paste each copied HEX into the RGB to CMYK converter to obtain the exact cyan, magenta, yellow, and black percentages for that named color.
  5. Record both the original HEX and the resulting CMYK breakdown in a shared swatch library, design template, or RIP color book so every DTF job uses the same numbers.
  6. Clear the filter input to restore all 148 rows when you finish building your DTF color chart, or switch to exact-match modes for precise lookups.

If your browser blocks clipboard access, the visible keyword, HEX, and RGB text remain selectable so you can still copy manually without losing the mapping.

Converting the HEX to CMYK for Your DTF File

The chart itself only outputs HEX and RGB — it is a reference, not a print-space generator — so the supported DTF workflow is two steps: look up the HEX, then convert to CMYK. Once you have copied the HEX, paste it into the RGB to CMYK converter to get the cyan, magenta, yellow, and black percentages for your artwork. Then paste those CMYK values into Illustrator, Photoshop, CorelDRAW, or your DTF RIP's color library so the same numbers travel with the file. If your shop uses a specific ICC profile such as FOGRA, GRACoL, or SWOP, re-check the converted CMYK against that profile, because a CMYK breakdown tuned for coated offset paper will reproduce differently on the film and textile of a DTF job. For broader palette planning beyond single conversions, the dedicated guide on finding exact CMYK matches using HTML color names for DTF printing walks through the same workflow with extra examples.

Search Methods in the Chart

The filter input accepts three different search modes, and choosing the right one saves time when you already know part of the value you need for your DTF job.

Search Mode Input Example Matching Behavior Best For
Keyword fragment "red", "dark", "gray" Case-insensitive substring match on CSS name Browsing a palette family for DTF design
Exact HEX #ff0000 Exact six-digit hexadecimal match Verifying a HEX you already have
Complete rgb(...) rgb(255, 0, 0) Exact three-channel match Looking up a value lifted from CSS

A complete rgb(...) search uses exact matching so a short numeric fragment cannot accidentally match an unrelated channel value, and a search beginning with # uses exact HEX matching. If nothing matches, the chart shows a no-match message rather than substituting a nearby color, so you can trust that the absence of a row really means the value is not in the chart.

Standardized Aliases Worth Knowing for DTF Files

The chart preserves standardized aliases as separate rows because each spelling is a valid CSS identifier and is useful when reading or maintaining existing stylesheets that may target DTF output. These are not accidental duplicate records — they are intentional mappings that designers and developers rely on.

Alias 1 Alias 2 Shared HEX Shared RGB
aqua cyan #00ffff rgb(0, 255, 255)
fuchsia magenta #ff00ff rgb(255, 0, 255)
gray grey #808080 rgb(128, 128, 128)
darkgray darkgrey #a9a9a9 rgb(169, 169, 169)
lightgray lightgrey #d3d3d3 rgb(211, 211, 211)

These pairings matter when a DTF job's source stylesheet spells a color with the American or British form — the chart returns the same HEX so your conversion to CMYK stays stable either way.

What the Chart Does Not Replace

The HTML Color Names Chart is a color reference, not a prepress or calibration tool. It cannot predict how a color will reproduce on a specific textile, ink set, or RIP profile; that depends on your DTF hardware and the ICC profile your shop uses. It is also not a contrast checker — for accessibility decisions on a garment mockup or web preview of the design, a dedicated contrast checker handles WCAG evaluations. For gradients, palette generation, image sampling, or historical web-safe colors, the focused tools in this category are a better fit than forcing this reference chart to do work it was not designed for. The keyword names themselves are historical identifiers: some neighboring rows look surprisingly similar, and the names do not promise perceptually even lightness, so do not treat the chart as a scientific taxonomy of color. Used as a stable lookup table between HEX and your DTF CMYK workflow, however, it gives your print shop and your design team a shared vocabulary grounded in the W3C CSS Color 4 named-colors specification.