CSS color name to hex
The CSS color name tomato is #ff6347, or rgb(255, 99, 71), the exact shade every browser paints. Turn color names from a style guide or brand deck into hex codes you can paste into tokens and tickets. Free in your browser.
- Free
- Runs in your browser
- No sign-up
- Your data stays on your device
Run — free
Worked example
- Name
- tomato
- Name raw
- tomato
- Hex
- #ff6347
- Hex6
- ff6347
- Resistance (Ω)
- 255
A CSS color name to hex converter takes a human-readable named color from the web platform—words such as tomato, navy, coral, or rebeccapurple—and returns the exact hexadecimal code and red, green, and blue channel values that browsers resolve when they paint that name. Paste a single CSS identifier; the tool normalizes case, looks the name up in the CSS Color Level 4 extended named-color table, and returns a lowercase #rrggbb string, integer channels from zero through two hundred fifty-five, a ready-to-paste rgb() string, and step-by-step lookup lines you can assert in tests.
What CSS named colors are and how hex is derived
Cascading Style Sheets define a fixed vocabulary of extended named colors that every modern browser maps to the same sRGB triple. When a stylesheet says color tomato or background rebeccapurple, the engine does not invent a shade: it resolves the keyword through a standard table of one hundred forty-eight names—including British and American grey or gray spellings and the Level 4 addition rebeccapurple—into three eight-bit channels. Those channels pack into the familiar hexadecimal form #RRGGBB that design tools, design tokens, and email HTML still use every day.
For tomato the table yields red two hundred fifty-five, green ninety-nine, blue seventy-one, which packs as #ff6347; for navy the channels are zero, zero, one hundred twenty-eight and the hex is #000080. Classroom exercises and design handoffs often start from a name in a brand deck; having a deterministic reference removes ambiguity about case, spelling variants, and whether a marketing color word is actually a CSS keyword.
Practical tips, limits, and related searches
Prefer sending the exact CSS keyword your stylesheet or design system already uses, including camel-style mixed case if that is how it appears in a ticket; the response always normalizes to a lowercase name and lowercase six-digit hex so downstream diffs stay stable. Do not pass hex codes such as #ff6347 or functional notations such as rgb(255, 99, 71)—this landing is intentionally limited to named keywords, and those formats are rejected so you notice rather than silently failing a table miss.
Transparent and currentcolor are not mapped to opaque hex here; if you need alpha or system colors, use a different tool. Prefer this capability when you already have a CSS keyword and only need the hex token or channel integers; if your source is already hex, use a hex-to-RGB converter instead.
What you can do with it
Design token handoff from named brand colors
Designers list brand colors as CSS names in a style guide; engineers paste each name and receive exact #rrggbb and rgb() values for tokens and tickets.
Content and CMS color fields
Editors type tomato or navy in a CMS field; the backend resolves the keyword to hex before writing CSS variables or email templates.
FAQ
Which color names are supported?
All 148 CSS Color Level 4 extended named colors, including rebeccapurple and both gray/grey spellings where the standard defines them. Case is ignored.
Can I pass a hex code like #ff6347?
No. This tool converts names to hex only. For hex to RGB, use a hex-to-RGB converter instead.
Are aqua and cyan the same?
Yes. In the CSS table both names map to the same triple (0, 255, 255) and the same hex #00ffff.
What is the hex code for tomato?
Tomato is #ff6347, which is red 255, green 99 and blue 71. Every modern browser paints the name tomato with exactly that color.
Does capitalization matter in a color name?
No. Color names are not case sensitive, so Tomato, tomato and DarkSlateGray all work. The answer always comes back as a lowercase name with a lowercase hex code.
Related tools
For developers — API access
Everything on this page is available programmatically. This section is for teams who want to wire it into their own systems; everyone else can just use the tool above.
API endpoint
Prefer to automate it? One authenticated POST creates the task; the result comes back by webhook or a signed link. The same capability also runs here on the web, by email and from Telegram — and soon from our app too.
Call it from your stack
curl -X POST https://api.kit.forhosting.com/color/name-hex \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"name":"tomato"}'const res = await fetch("https://api.kit.forhosting.com/color/name-hex", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"name": "tomato"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/name-hex",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"name": "tomato"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/name-hex", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"name":"tomato"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"name":"tomato"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/name-hex", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Example request
{
"name": "tomato"
}Example response
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.name_hex",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}The API is asynchronous: the call returns a task_id immediately and the result arrives by webhook. Polling is capped at 1 req/s per task.
Pricing
Published price — no tokens, no invented credits. A failed task is never charged.
Limits
max_name_chars | 64 |
Errors
| HTTP | Code | Meaning |
|---|---|---|
401 | unauthorized | Missing or invalid API key. |
402 | insufficient_balance | Your balance doesn't cover the task price. |
404 | unknown_type | That task type doesn't exist. |
429 | rate_limited | Too many requests. Use the webhook instead of polling. |
Technical notes
Unrecognized names, bare hex codes, rgb() or hsl() functional notations, and multi-word phrases with spaces fail with a clear invalid_input error instead of inventing a color.
How to call the API and what comes back
Valid examples include tomato, Tomato, rebeccapurple, DarkSlateGray, and lightskyblue; surrounding whitespace is trimmed, optional surrounding quotes are stripped, and letters may be upper or lower case because CSS color names are case-insensitive. Send a JSON body with one required string field named name—aliases color, value, text, input, and color_name are accepted by the same solver. On success the response returns name as the canonical lowercase key, name_raw as the trimmed original string, hex as a normalized lowercase #rrggbb string, hex6 without the hash, integer fields r, g, and b together with red, green, and blue aliases, an rgb array of three numbers, a css string of the form rgb(r, g, b), a short English message, and a steps array that shows the normalized key and each channel-to-hex line for debugging or teaching. Failed validation—missing field, empty string, non-string types, hex codes with or without a hash, rgb() or hsl() forms, spaces inside a multi-word phrase, characters outside A–Z, length beyond the published limit, or any string not present in the named-color table—returns invalid_input and is never charged. Pricing is a flat $0.002 per successful request with unit item and zero marginal unit price.
Practical tips, limits, and related searches
Failed tasks that return invalid_input do not consume prepaid balance, which keeps exploratory scripts and form validation cheap while learners paste imperfect clipboard values.
Integration use cases
Unit tests for theme and palette fixtures
Pin known-good hex and RGB triples from CSS keywords so visual regression and contrast-ratio tests assert stable channel values.
Technical questions
What happens if the name is not a CSS color?
The API returns invalid_input with a message that the name is unrecognized. No charge is applied for failed validation.
Is the CSS color name to hex converter free?
Yes in the browser runner. Via the API, successful conversions are billed at a flat $0.002 per request; invalid_input results are not charged.