About the Colortone to HEX Converter
What is colortone to HEX conversion?
A colortone is a named color, a label like "Emerald", "Burnt Orange", or "Slate Gray" that people use when they talk about color. Screens and stylesheets do not understand labels, they need numbers. This tool closes that gap, giving you the HEX code for any colortone plus its RGB, HSL, HSB, and CMYK values and a live preview.
The chart holds 279 colortones. 139 of them are official CSS color keywords, flagged with a CSS badge so you know you can type the name straight into a stylesheet. The other 140 are common design, paint, and print names with no CSS equivalent, where the HEX value is what you want. Filter by color family, search by name or HEX, and click any swatch to load its full values.
How to Use This Tool
- Find your colortone. Scroll the chart, filter it by family with the chips (Reds, Blues, Neutrals, and so on), or search by name (
teal) or HEX (#40E0D0). - Select it. Click a swatch and its details load on the left with a live preview.
- Check the CSS badge. A blue CSS badge shows the exact keyword to type in a stylesheet. "HEX only" means the name has no CSS equivalent, so use the HEX value.
- Copy what you need. Every format has its own copy button: HEX for the web, RGB for code, CMYK for print.
Common Use Cases
- Turning a brief into code: A client asks for "something in sage", and you need the number that goes in the stylesheet.
- Checking a CSS keyword before you use it: See what
rebeccapurpleorpapayawhipactually looks like without writing a test page. - Browsing a family: Filter to Greens or Neutrals and scan the whole range at once when you are picking a direction.
- Filling in a brand document: Get HEX, RGB, and CMYK for one named color so every medium is covered in a single row.
- Learning the CSS color list: All 139 CSS color keywords are here with live swatches, searchable and filterable.
Going the other way? Use the HEX to Colortone converter to find the closest name for a HEX code you already have. You may also want the RAL to HEX converter for paint standards, or the rest of our free color tools.
Frequently Asked Questions
What is a colortone?
A colortone is a named color, a readable label attached to a specific HEX value. "Crimson", "Terracotta", and "Midnight Blue" are colortones. The name is what people use in conversation and the HEX is what a browser or a print job needs, so a colortone is really a pairing of the two.
How many colortones are in the chart?
279, and each one has a unique name and a unique HEX value. 139 are official CSS color keywords and the remaining 140 are widely used design, paint, and print color names. You can browse them all, filter them by one of ten color families, or search instantly.
Which colortones work as CSS color names?
The 139 flagged with a blue CSS badge. That badge shows the exact keyword, written the way CSS expects it, so "Dark Slate Gray" becomes darkslategray. Anything labeled "HEX only" is a common color name that browsers do not recognize, so use its HEX value in your stylesheet instead.
Why do some colortones show a second name?
Because CSS defines a handful of duplicates. aqua and cyan are the same color, as are fuchsia and magenta, and every "gray" keyword also has a "grey" spelling. Rather than list the same color twice we show one entry with the alternate spelling underneath, so both work in your CSS.
Are these HEX values exact or approximate?
The 139 CSS keywords are exact, since the CSS specification defines each keyword as a precise sRGB value. The other names are the widely accepted standard values for those colors, which is the best that can be done for names that no single body defines.
Can I get CMYK for print, not just HEX?
Yes. Every colortone shows HEX, RGB, HSL, HSB, and CMYK, each with its own copy button. Bear in mind that CMYK here is a straight mathematical conversion from sRGB, so for critical print work you should still check against a proof.
Is this tool free and private?
Completely. The lookup runs entirely in your browser with JavaScript, so nothing is uploaded or logged, and it keeps working offline once the page has loaded.