CSS color names list

Type part of a name or a HEX code to filter the list, sort it by name, hue or lightness, and copy the name or the code with one click.

Search by name or HEX

Sort by

148 colors

Color	Name	HEX
	`aliceblue`	`#f0f8ff`
	`antiquewhite`	`#faebd7`
	`aqua`	`#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`
	`cyan`	`#00ffff`
	`darkblue`	`#00008b`
	`darkcyan`	`#008b8b`
	`darkgoldenrod`	`#b8860b`
	`darkgray`	`#a9a9a9`
	`darkgreen`	`#006400`
	`darkgrey`	`#a9a9a9`
	`darkkhaki`	`#bdb76b`
	`darkmagenta`	`#8b008b`
	`darkolivegreen`	`#556b2f`
	`darkorange`	`#ff8c00`
	`darkorchid`	`#9932cc`
	`darkred`	`#8b0000`
	`darksalmon`	`#e9967a`
	`darkseagreen`	`#8fbc8f`
	`darkslateblue`	`#483d8b`
	`darkslategray`	`#2f4f4f`
	`darkslategrey`	`#2f4f4f`
	`darkturquoise`	`#00ced1`
	`darkviolet`	`#9400d3`
	`deeppink`	`#ff1493`
	`deepskyblue`	`#00bfff`
	`dimgray`	`#696969`
	`dimgrey`	`#696969`
	`dodgerblue`	`#1e90ff`
	`firebrick`	`#b22222`
	`floralwhite`	`#fffaf0`
	`forestgreen`	`#228b22`
	`fuchsia`	`#ff00ff`
	`gainsboro`	`#dcdcdc`
	`ghostwhite`	`#f8f8ff`
	`gold`	`#ffd700`
	`goldenrod`	`#daa520`
	`gray`	`#808080`
	`green`	`#008000`
	`greenyellow`	`#adff2f`
	`grey`	`#808080`
	`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`	`#d3d3d3`
	`lightgreen`	`#90ee90`
	`lightgrey`	`#d3d3d3`
	`lightpink`	`#ffb6c1`
	`lightsalmon`	`#ffa07a`
	`lightseagreen`	`#20b2aa`
	`lightskyblue`	`#87cefa`
	`lightslategray`	`#778899`
	`lightslategrey`	`#778899`
	`lightsteelblue`	`#b0c4de`
	`lightyellow`	`#ffffe0`
	`lime`	`#00ff00`
	`limegreen`	`#32cd32`
	`linen`	`#faf0e6`
	`magenta`	`#ff00ff`
	`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`	`#708090`
	`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`

Runs in your browser: nothing you enter is sent anywhere.

How to use it

Type in the search box. It matches a part of the name (blue) or of the HEX code (ff00), with or without #.
Pick a sort order: by name, by hue (a rainbow order) or by lightness.
Press Copy name or Copy HEX next to a color.

What the list contains

The list holds the 148 names from CSS Color Level 4: the 147 familiar ones that go back to CSS3 and SVG (counting the gray and grey spellings separately), plus rebeccapurple. Each name is an alias for a fixed sRGB value. red is always #ff0000.

Example

Searching gold shows gold (#ffd700), darkgoldenrod, goldenrod, lightgoldenrodyellow and palegoldenrod. Sorted by lightness, the dark one comes first and the pale one last.

Tips

Names are handy for quick prototypes, but a design system usually needs its own values: convert a name to HSL or OKLCH with the color converter and adjust from there.
Lightness here is the perceptual lightness of OKLab, which is closer to what you see than a simple average of red, green and blue.
Check text contrast before using a name for text: yellow on white is only 1.07:1.

Frequently asked questions

How many named colors does CSS have?

CSS Color Module Level 4 defines 148 named colors. That count includes both spellings gray and grey (and the dark, dim, light and slate variants), and rebeccapurple, which was added in 2014. The keywords transparent and currentcolor are not named colors.

Are gray and grey the same color?

Yes. Every gray name has a grey twin with the identical value, for example gray and grey are both #808080, and darkgray and darkgrey are both #a9a9a9.

What is the difference between green and lime?

In CSS, green is the darker #008000 and lime is the pure #00ff00. Likewise purple is #800080 while fuchsia and magenta are both #ff00ff, and aqua and cyan are both #00ffff.

What does the Hue sort do with greys?

Colors are ordered by their HSL hue from red round to violet and back to red. Greys have no hue, so they come last, from dark to light.

Do named colors work everywhere in CSS?

Yes, anywhere CSS takes a color: color, background, border, fill in inline SVG and gradient stops. Names are case-insensitive. For designs you want to tune, HEX, HSL or OKLCH values are easier to adjust.

More in Color

All tools in this category: Color ·Updated November 3, 2026