Color Name Finder
Turn a color value into a name you can actually say out loud.
100% in-browser · no data sent
Paste a hex, RGB or HSL color (or pick one) and this tool compares it against all 148 CSS named colors, then ranks the closest matches by perceptual similarity. Useful when a client says "make it teal" and you need to know which teal, or when you want to check whether a hex has an official CSS keyword at all.
Embed This Tool
Add this tool to your website with customizable styling
How to Use
Enter a color
Type a hex value like #4A90D9, an rgb() or hsl() string, or an existing CSS keyword. You can also use the swatch to pick a color visually, or click one of the examples.
Read the verdict
The tool tells you straight away whether your color has an exact CSS name, or which name comes closest and how close it is as a percentage.
Compare the nearest names
The six closest CSS colors are shown as swatches with their hex values and a similarity score, so you can see the trade-off rather than trusting one answer.
Copy what you need
Copy the CSS keyword to use in your stylesheet, or copy the canonical hex, rgb() or hsl() form of the color you entered.
Frequently Asked Questions
How does it decide which color name is closest?
It converts both colors to the CIE L*a*b* color space and measures the distance between them (Delta E). Lab is designed so that equal distances look like equal differences to the human eye, which plain RGB distance does not do — RGB would call two dark colors as different as two bright ones. That is why the nearest name here usually matches what you would pick yourself.
How many color names are there in CSS?
CSS Level 4 defines 148 named colors, from aliceblue to yellowgreen. Several are duplicates under two spellings (gray/grey, aqua/cyan, fuchsia/magenta), so there are fewer unique colors than names. This tool lists each unique color once and shows the alternative spelling where one exists.
What does the similarity percentage mean?
It is the Delta E distance rescaled to a 0–100 score, where 100% means the colors are identical. As a rough guide, a Delta E under about 2.3 is a difference most people cannot see side by side, so anything scoring above roughly 97% will look like the same color to the eye.
Can I use a color name instead of a hex code in CSS?
Yes — every name here is valid CSS, so color: rebeccapurple works exactly like color: #663399. Names are easier to read but there are only 148 of them, so for anything off-palette use the hex value. Note the names are fixed by the spec and cannot be redefined.