Color Name Finder

How to use the Color Name Finder

1. Enter or pick a color to see the five closest named colors and how close each one is.
2. Search the list by name or code, and sort it by hue, lightness or name.
3. Click any color to copy its name or HEX code.

Color Name Finder features

• Five closest named colors for any HEX, RGB or HSL value, with how close each one is
• Perceptual matching in OKLab, not raw RGB distance
• All 148 CSS named colors with their HEX codes
• Search by name or code, sort by hue, lightness or name
• Click to copy a color name or HEX code

What is the name of this color?

Have a hex code like #6A5ACD and want to know what to call it? The color name finder matches any HEX, RGB or HSL color to the closest named CSS colors and shows you how close each match is. It is useful for writing readable CSS, describing colors to clients, naming design tokens, writing alt text and product descriptions, or simply settling the question of whether something is teal or turquoise.

Below the finder you can browse, search and sort all 148 named CSS colors, from aliceblue to yellowgreen, and copy any name or hex code with a click.

How matching works

Comparing colors by their RGB numbers is misleading, because equal numeric differences do not look equally different to our eyes. The finder measures distance in OKLab, a color space built to match human perception, so the suggested name is the one that genuinely looks most similar. Each of the five closest matches is labelled from exact match through very close, close and similar to distant, so you know how much to trust the name.

About the CSS color names

CSS accepts 148 color keywords that work anywhere a color is expected, for example color: tomato; or border-color: steelblue;. Most of them come from the X11 window system of the 1980s, which is why the list includes oddities like papayawhip, blanchedalmond and lightgoldenrodyellow. The most recent addition is rebeccapurple (#663399), added in 2014 in memory of Rebecca Meyer, the daughter of CSS pioneer Eric Meyer.

A few quirks are worth knowing:

• Gray and grey are both accepted for every gray color (gray, darkgray, slategrey and so on) and are identical. The list shows the "gray" spelling once.
• Aqua and cyan are the same color (#00FFFF), as are fuchsia and magenta (#FF00FF).
• darkgray is lighter than gray. darkgray is #A9A9A9, while gray is #808080, a historical accident from merging two color lists.
• transparent and currentColor are also valid CSS color keywords, but they are not fixed colors, so they are not in the list.

Popular named colors and their codes

Browse and search all CSS colors

Type in the search box to filter the full list by name (for example "blue" or "light") or by code. Sort the colors by hue to see them as a rainbow, by lightness to find the darkest and lightest options, or alphabetically. Click a color to copy its name or hex code.

When to use named colors

Named colors are convenient for prototypes, demos, teaching and quick debugging, because red is easier to read than #FF0000. For a finished product, most teams prefer a defined palette of hex, RGB or OKLCH values stored as variables, because the named colors were never designed to work together. Use the name finder to give your own palette colors human-friendly names, then build the palette itself with the Color Palette Generator.

Related tools

To find the name of a color in a photo, pick it with the Image Color Picker, which shows the closest name for every pick. To convert a named color to HEX, RGB, HSL, CMYK or OKLCH, use the Color Converter.

Color Name Finder: frequently asked questions