Color Name Converter

Find the nearest CSS named color for any hex, RGB, or color name. All 148 CSS color names included.

Input Hex: #ff5733Nearest Name: tomatoMatch Type: Closest MatchDistance: 23.3

Presets:

Color Input

Conversion Result

Input

#ff5733

rgb(255, 87, 51)

Nearest CSS name

tomato

#ff6347

Distance: 23.3

CSS named colors explained

CSS defines 148 named colors — from aliceblue to yellowgreen — that browsers recognize by name. They span X11 colors (from the 1980s X Window System) plus additions in CSS3 like rebeccapurple(added in 2014 in memory of Eric Meyer's daughter). This tool finds the nearest CSS named color to any hex or RGB value using Euclidean distance in RGB space.

Built and maintained by Meet Shah · Last updated 14 August 2026

What this tool is used for

Finding the nearest CSS named colour to a hex value.
Deciding whether a named colour is close enough to use in place of a hex.
Identifying which named colour a value was probably meant to be.
Getting a human-readable label for a colour in documentation.
Checking whether a hex is one of the named colours exactly.

Frequently Asked Questions

How many CSS colour names are there?: 148, and this tool now carries all of them. They come almost entirely from the X11 window system of the 1980s — which is why the set is so uneven, with 9 shades named for grey and none between `blue` and `navy` — plus `rebeccapurple`, added in 2014 in memory of Eric Meyer's daughter.
Are `gray` and `grey` both valid?: Yes. CSS accepts both spellings for all seven grey keywords — `gray`/`grey`, `lightgray`/`lightgrey`, `darkslategray`/`darkslategrey` and so on — and they are exactly the same colour. The nearest-match result reports the American spelling, since a tie has to resolve to one of them.
How is the nearest colour found?: Straight Euclidean distance in RGB space: the square root of the summed squared channel differences. It is fast and it is what makes an exact match report a distance of 0 — but RGB distance is not perceptual, so two colours the same distance apart can look very differently separated.
Why does the nearest name sometimes look wrong?: Because equal RGB distance does not mean equal perceived difference. Blue channel changes are much harder to see than green ones, so a mathematically close blue can look further off than a mathematically distant green. A CIELAB or ΔE2000 comparison matches the eye better at more computational cost.
Should I use named colours in production?: For quick prototyping and debugging, yes — `red` is faster to type than a hex and instantly recognisable in a diff. For real design work, no: the palette is arbitrary, the names carry no relationship to each other, and a design token pointing at a hex is what actually survives a theme change.

Common errors and gotchas

Treating the nearest name as identical, when the distance may be clearly visible.
Assuming the CSS named colours are a coherent palette, when they are a historical accident.
Using a name in a brand context where exactness is required.
Confusing similarly named colours, where several greys and greens differ subtly.
Assuming a name means the same in every language or design tool.