Hex to Color Name

What this tool does

A hex code like #708090 is precise, but it does not stick in anyone's head. Tell a colleague the colour is "Slate Gray" and they can picture it at once. Names are how people actually talk about colour, while hex codes are how machines store it, and there is often a gap between the two you need to cross.

That is what this does. You give it a hex code, and it returns the closest colour name, along with the swatch, so a bare code turns into a word you can say and remember. It is the difference between reading out a string of characters and simply calling a colour what it is.

How to use it

1. Enter a hex code. Paste or type it into the field, hash or no hash, or pick a colour with the picker.
2. Read the name. The tool shows the closest matching colour name for your code, next to the colour itself.
3. Use it as you like. Take the name to describe or label the colour, and keep the swatch alongside to confirm it looks right.

The full and short hex forms both work and the hash is optional. If you are starting from a colour rather than a code, set it with the picker and the matching name appears the same way.

How it works

Behind the scenes the tool uses Name That Color, a library built for exactly this. It holds a long list of named colours, each with its own hex value, and when you give it a code it measures the distance between your colour and every name on the list, then returns whichever one is closest.

That word, closest, is the key to the whole thing. Your exact hex code will only occasionally land precisely on a named colour, so most of the time the tool is finding the nearest neighbour rather than an exact hit. The result is the best available name for your colour, which is almost always what you actually want, even if it is not a perfect identity.

Why colours have names

Names exist because numbers are hard to communicate and easy to forget. We have called colours by name for far longer than we have had hex codes, and words like crimson, teal, and olive carry an instant, shared sense of a colour that #DC143C never will. A name is something you can say aloud, write in a brief, and recall later.

The web inherited this habit. The CSS standard includes a set of named colours you can use directly in place of a code, words like tomato, gold, and steelblue that map to specific hex values. Those are only a small, fixed set, though, so the named colours a tool like this draws on come from much larger lists assembled over the years, giving names to thousands of points across the colour space.

The nearest match idea

It helps to be clear about what the result really represents. There are millions of possible hex codes and only a few thousand named colours, so the names are scattered across the colour space like landmarks, with vast stretches between them that have no name of their own. When you look up a code, the tool finds the landmark nearest to where your colour sits.

One consequence is that several slightly different hex codes can all return the same name, because they all fall closest to the same landmark. That is not the tool being vague; it is the honest situation, since fine differences between colours are real but most do not have separate names. The name tells you the neighbourhood your colour lives in, which is usually exactly the level of description you need.

Why put a name to a hex code

The most common reason is communication. When you are describing a colour to a client, a teammate, or yourself in a note for later, a name carries meaning that a code does not. "Make the heading Steel Blue" is understood instantly, where reciting a hex code is not.

It is also useful for making sense of colours you did not choose. A name gives you a quick handle on an unfamiliar hex code, a fast way to grasp roughly what it is without rendering it. Designers use it to label brand colours in human terms, to write clearer documentation, and simply to bring a bit of language to values that would otherwise stay as anonymous strings.

Exact names versus nearest names

There is a real distinction between a colour that has a name and a colour that is merely near one. Some hex codes do match a named colour exactly: #FF6347 is precisely Tomato in the CSS set, not just close to it. For those, the name is an exact identity, not an approximation.

Most codes are not so lucky. A value a shade or two away from Tomato is not Tomato, but the tool will still return that as the nearest name because it is the best fit available. So read the result with that in mind: sometimes the name is exact, and often it is the closest landmark to a colour that has no official name of its own. Either way it is the most useful word for the colour, which is the point of asking.

Questions people ask

How do I find the name of a hex code?

Paste the code into the tool and it returns the closest matching colour name from a large list of named colours, shown next to the colour itself.

Is the name exact?

Sometimes. A few hex codes match a named colour precisely, but most return the nearest name instead, since there are millions of possible colours and only a few thousand names. The result is the best available match.

How many named colours are there?

The CSS standard defines a small fixed set you can use directly, but tools like this draw on much larger lists naming thousands of colours across the spectrum, which is why almost any code gets a reasonable match.

Do I include the hash in the code?

No need. The hash is optional, and both the full six-character and short three-character hex forms are accepted, so you can enter a code however you have it.

References

1. Name That Color (Chirag Mehta). Documentation. http://chir.ag/projects/ntc/
2. World Wide Web Consortium (W3C), CSS Color Module Level 4, named colors. https://www.w3.org/TR/css-color-4/
3. Color term, how colours are named across languages. Wikipedia. https://en.wikipedia.org/wiki/Color_term