Color Name Finder: HEX to Color Name, Free Online

Your color (HEX, rgb() or hsl())

Closest CSS color name

mediumslateblue

#7B68EE · rgb(123, 104, 238) · Delta E 3.9 (similar)

royalblue

#4169E1 · rgb(65, 105, 225) · Delta E 5.9 (similar)

slateblue

#6A5ACD · rgb(106, 90, 205) · Delta E 6.6 (similar)

mediumpurple

#9370DB · rgb(147, 112, 219) · Delta E 9.7 (loose match)

slategray / slategrey

#708090 · rgb(112, 128, 144) · Delta E 13.1 (loose match)

Your color in other formats

HEX#6366F1

RGBrgb(99, 102, 241)

HSLhsl(239, 84%, 67%)

CMYKcmyk(59%, 58%, 0%, 5%)

CSS variable--mediumslateblue: #6366F1;

Tailwind classindigo-500 (#6366F1, Delta E 0.0)

Lighter and darker (click to name it)

Tints

Shades

Name a list of colors

Paste hex, rgb() or hsl() values, one per line or separated by commas (up to 500). Each gets its nearest CSS color name.

Input	Nearest name	Delta E
#1877F2	royalblue	6.4
#E4572E	orangered	5.4
#2A9D8F	lightseagreen	6.9
#F4A261	sandybrown	1.1
#264653	darkslategray	7.9

Export named colors (SCSS, Tailwind, JSON, SVG, PNG, ASE and more)

Format

$colors-royalblue: #1877F2;
$colors-orangered: #E4572E;
$colors-lightseagreen: #2A9D8F;
$colors-sandybrown: #F4A261;
$colors-darkslategray: #264653;

All 148 CSS color names

139 colors shown

aliceblue

#F0F8FF

antiquewhite

#FAEBD7

aqua / cyan

#00FFFF

aquamarine

#7FFFD4

azure

#F0FFFF

beige

#F5F5DC

bisque

#FFE4C4

black

#000000

blanchedalmond

#FFEBCD

blue

#0000FF

blueviolet

#8A2BE2

brown

#A52A2A

burlywood

#DEB887

cadetblue

#5F9EA0

chartreuse

#7FFF00

chocolate

#D2691E

coral

#FF7F50

cornflowerblue

#6495ED

cornsilk

#FFF8DC

crimson

#DC143C

darkblue

#00008B

darkcyan

#008B8B

darkgoldenrod

#B8860B

darkgray / darkgrey

#A9A9A9

darkgreen

#006400

darkkhaki

#BDB76B

darkmagenta

#8B008B

darkolivegreen

#556B2F

darkorange

#FF8C00

darkorchid

#9932CC

darkred

#8B0000

darksalmon

#E9967A

darkseagreen

#8FBC8F

darkslateblue

#483D8B

darkslategray / darkslategrey

#2F4F4F

darkturquoise

#00CED1

darkviolet

#9400D3

deeppink

#FF1493

deepskyblue

#00BFFF

dimgray / dimgrey

#696969

dodgerblue

#1E90FF

firebrick

#B22222

floralwhite

#FFFAF0

forestgreen

#228B22

fuchsia / magenta

#FF00FF

gainsboro

#DCDCDC

ghostwhite

#F8F8FF

gold

#FFD700

goldenrod

#DAA520

gray / grey

#808080

green

#008000

greenyellow

#ADFF2F

honeydew

#F0FFF0

hotpink

#FF69B4

indianred

#CD5C5C

indigo

#4B0082

ivory

#FFFFF0

khaki

#F0E68C

lavender

#E6E6FA

lavenderblush

#FFF0F5

lawngreen

#7CFC00

lemonchiffon

#FFFACD

lightblue

#ADD8E6

lightcoral

#F08080

lightcyan

#E0FFFF

lightgoldenrodyellow

#FAFAD2

lightgray / lightgrey

#D3D3D3

lightgreen

#90EE90

lightpink

#FFB6C1

lightsalmon

#FFA07A

lightseagreen

#20B2AA

lightskyblue

#87CEFA

lightslategray / lightslategrey

#778899

lightsteelblue

#B0C4DE

lightyellow

#FFFFE0

lime

#00FF00

limegreen

#32CD32

linen

#FAF0E6

maroon

#800000

mediumaquamarine

#66CDAA

mediumblue

#0000CD

mediumorchid

#BA55D3

mediumpurple

#9370DB

mediumseagreen

#3CB371

mediumslateblue

#7B68EE

mediumspringgreen

#00FA9A

mediumturquoise

#48D1CC

mediumvioletred

#C71585

midnightblue

#191970

mintcream

#F5FFFA

mistyrose

#FFE4E1

moccasin

#FFE4B5

navajowhite

#FFDEAD

navy

#000080

oldlace

#FDF5E6

olive

#808000

olivedrab

#6B8E23

orange

#FFA500

orangered

#FF4500

orchid

#DA70D6

palegoldenrod

#EEE8AA

palegreen

#98FB98

paleturquoise

#AFEEEE

palevioletred

#DB7093

papayawhip

#FFEFD5

peachpuff

#FFDAB9

peru

#CD853F

pink

#FFC0CB

plum

#DDA0DD

powderblue

#B0E0E6

purple

#800080

rebeccapurple

#663399

red

#FF0000

rosybrown

#BC8F8F

royalblue

#4169E1

saddlebrown

#8B4513

salmon

#FA8072

sandybrown

#F4A460

seagreen

#2E8B57

seashell

#FFF5EE

sienna

#A0522D

silver

#C0C0C0

skyblue

#87CEEB

slateblue

#6A5ACD

slategray / slategrey

#708090

snow

#FFFAFA

springgreen

#00FF7F

steelblue

#4682B4

tan

#D2B48C

teal

#008080

thistle

#D8BFD8

tomato

#FF6347

turquoise

#40E0D0

violet

#EE82EE

wheat

#F5DEB3

white

#FFFFFF

whitesmoke

#F5F5F5

yellow

#FFFF00

yellowgreen

#9ACD32

Follow @mytoolstudio

How to use

Enter your color

Type or paste a HEX code, rgb() or hsl() value into Your color, or use the color picker. The closest CSS name appears at once, with four more options below it.

Compare the matches

Each match shows your color beside the named color, its HEX and RGB values, and the Delta E score with a label such as very close. Press Copy name to copy the keyword.

Name a list or browse

Paste many colors into Name a list of colors and press Copy as CSV or Copy as CSS variables. Use the filter above the grid to search all 148 names.

Why Color Name Finder

Closest of all 148 CSS color names, plus four alternatives.
Pick from screen or from an image, or try a random color.
Nearest Tailwind class and RGB, HSL and CMYK values.
Bulk naming with CSV, CSS, SCSS, JSON and Tailwind export.

Popular hex codes and their CSS color names

These hex codes are exact CSS named colors, so the finder returns them with a Delta E of 0. They are useful starting points when you want a color you can type from memory. Remember that names are fixed values: tomato is always #FF6347, so you cannot make a lighter tomato without switching to a hex, rgb() or hsl() value.

HEX	CSS name	RGB
#FF6347	tomato	rgb(255, 99, 71)
#FF7F50	coral	rgb(255, 127, 80)
#DC143C	crimson	rgb(220, 20, 60)
#FFD700	gold	rgb(255, 215, 0)
#2E8B57	seagreen	rgb(46, 139, 87)
#40E0D0	turquoise	rgb(64, 224, 208)
#4169E1	royalblue	rgb(65, 105, 225)
#6495ED	cornflowerblue	rgb(100, 149, 237)
#000080	navy	rgb(0, 0, 128)
#663399	rebeccapurple	rgb(102, 51, 153)
#F5F5DC	beige	rgb(245, 245, 220)
#708090	slategray	rgb(112, 128, 144)

CSS, X11 and other color name lists

The 148 CSS names trace back to the X11 window system, which shipped a color list for Unix desktops. Web browsers adopted most of it, but where HTML 4 already had a basic color with the same name, CSS kept the HTML value. That is why gray, green, maroon and purple differ between the two lists, and why CSS also has lime for the bright green that X11 calls green.

Other lists are much larger. Some online tools use lists of 1,500 or more names, and survey based lists collected names from thousands of people. Larger lists give a closer name for more colors, but the names are not valid CSS. This finder sticks to CSS names so you can paste any result into a stylesheet. The one newer addition, rebeccapurple, was added in CSS Color Level 4 in memory of Rebecca Meyer.

Common questions

How do I find the name of a color from its hex code?

Paste the hex code into Your color. The finder compares it with every CSS named color using the CIEDE2000 Delta E formula and shows the closest name first. If the Delta E is under 1, the name is an exact or near exact match.

How many named colors are there in CSS?

CSS defines 148 named color keywords, not counting transparent and currentcolor. Some are aliases for the same color, such as aqua and cyan or gray and grey, so there are 139 distinct colors.

Can I use CSS color names in HTML and CSS instead of hex?

Yes. Any of the 148 names works anywhere a color is accepted, such as color: tomato or background: rebeccapurple, and names are not case sensitive. Hex codes are more precise, so most design systems use names only for quick prototypes.

What is the difference between CSS and X11 color names?

CSS names came from the X11 color list, but four names differ. In X11, gray is #BEBEBE, green is #00FF00, maroon is #B03060 and purple is #A020F0. In CSS they are #808080, #008000, #800000 and #800080, and lime is the CSS name for #00FF00.

Why do different color name tools give different names?

Each tool uses its own list. Some use the 148 CSS names, some use lists of 1,500 or more names from other sources, and each may measure closeness differently. This tool uses only CSS names, so every result is a valid CSS keyword.

Can I find a color name from an image?

Yes. Press Pick from an image, then drop, paste or choose the image and click the pixel you want. The finder names it at once. Photos contain many slightly different pixels, so pick an area of flat color and use the magnifier to aim.

How do I name a list of colors for a design system?

Paste up to 500 colors into Name a list of colors, one per line or separated by commas. Copy as CSS variables gives lines like --color-royalblue with your original hex, and numbers repeated names such as royalblue-2. Rename any token that does not fit your system.

How should I name colors in a design system?

Many teams use two layers: base names for the raw palette, such as blue-500, and role names for how a color is used, such as --color-text or --color-danger. Descriptive names from this finder work well for the base layer during early design.

What does the Delta E number next to a color name mean?

It measures how different your color and the named color look. Under 1 is near identical, under 3 is very close, and above 8 means the name is only a loose description. Many hex codes have no close CSS name, because the list has only 139 distinct colors.

More Color tools

View all

Color Name Finder