命名颜色

CSS 颜色名称表

这里收录了 148 个浏览器支持的标准 CSS 命名颜色，方便你直接查询颜色名、HEX、RGB 和写法，适合网页开发、样式调试与配色参考。

快速查询

支持按颜色名称、HEX 和 RGB 搜索，例如 tomato、rebeccapurple、#FF6347 或 255, 99, 71。

颜色名HEXRGBCSS 写法备注

aliceblue#F0F8FF240, 248, 255color: aliceblue;-

antiquewhite#FAEBD7250, 235, 215color: antiquewhite;-

aqua同色别名：cyan#00FFFF0, 255, 255color: aqua;与 cyan 为同色别名。

aquamarine#7FFFD4127, 255, 212color: aquamarine;-

azure#F0FFFF240, 255, 255color: azure;-

beige#F5F5DC245, 245, 220color: beige;-

bisque#FFE4C4255, 228, 196color: bisque;-

black#0000000, 0, 0color: black;-

blanchedalmond#FFEBCD255, 235, 205color: blanchedalmond;-

blue#0000FF0, 0, 255color: blue;-

blueviolet#8A2BE2138, 43, 226color: blueviolet;-

brown#A52A2A165, 42, 42color: brown;-

burlywood#DEB887222, 184, 135color: burlywood;-

cadetblue#5F9EA095, 158, 160color: cadetblue;-

chartreuse#7FFF00127, 255, 0color: chartreuse;-

chocolate#D2691E210, 105, 30color: chocolate;-

coral#FF7F50255, 127, 80color: coral;-

cornflowerblue#6495ED100, 149, 237color: cornflowerblue;-

cornsilk#FFF8DC255, 248, 220color: cornsilk;-

crimson#DC143C220, 20, 60color: crimson;-

cyan同色别名：aqua#00FFFF0, 255, 255color: cyan;与 aqua 为同色别名。

darkblue#00008B0, 0, 139color: darkblue;-

darkcyan#008B8B0, 139, 139color: darkcyan;-

darkgoldenrod#B8860B184, 134, 11color: darkgoldenrod;-

darkgray同色别名：darkgrey#A9A9A9169, 169, 169color: darkgray;与 darkgrey 为同色别名。

darkgreen#0064000, 100, 0color: darkgreen;-

darkgrey同色别名：darkgray#A9A9A9169, 169, 169color: darkgrey;与 darkgray 为同色别名。

darkkhaki#BDB76B189, 183, 107color: darkkhaki;-

darkmagenta#8B008B139, 0, 139color: darkmagenta;-

darkolivegreen#556B2F85, 107, 47color: darkolivegreen;-

darkorange#FF8C00255, 140, 0color: darkorange;-

darkorchid#9932CC153, 50, 204color: darkorchid;-

darkred#8B0000139, 0, 0color: darkred;-

darksalmon#E9967A233, 150, 122color: darksalmon;-

darkseagreen#8FBC8F143, 188, 143color: darkseagreen;-

darkslateblue#483D8B72, 61, 139color: darkslateblue;-

darkslategray同色别名：darkslategrey#2F4F4F47, 79, 79color: darkslategray;与 darkslategrey 为同色别名。

darkslategrey同色别名：darkslategray#2F4F4F47, 79, 79color: darkslategrey;与 darkslategray 为同色别名。

darkturquoise#00CED10, 206, 209color: darkturquoise;-

darkviolet#9400D3148, 0, 211color: darkviolet;-

deeppink#FF1493255, 20, 147color: deeppink;-

deepskyblue#00BFFF0, 191, 255color: deepskyblue;-

dimgray同色别名：dimgrey#696969105, 105, 105color: dimgray;与 dimgrey 为同色别名。

dimgrey同色别名：dimgray#696969105, 105, 105color: dimgrey;与 dimgray 为同色别名。

dodgerblue#1E90FF30, 144, 255color: dodgerblue;-

firebrick#B22222178, 34, 34color: firebrick;-

floralwhite#FFFAF0255, 250, 240color: floralwhite;-

forestgreen#228B2234, 139, 34color: forestgreen;-

fuchsia同色别名：magenta#FF00FF255, 0, 255color: fuchsia;与 magenta 为同色别名。

gainsboro#DCDCDC220, 220, 220color: gainsboro;-

ghostwhite#F8F8FF248, 248, 255color: ghostwhite;-

gold#FFD700255, 215, 0color: gold;-

goldenrod#DAA520218, 165, 32color: goldenrod;-

gray同色别名：grey#808080128, 128, 128color: gray;与 grey 为同色别名。

green#0080000, 128, 0color: green;-

greenyellow#ADFF2F173, 255, 47color: greenyellow;-

grey同色别名：gray#808080128, 128, 128color: grey;与 gray 为同色别名。

honeydew#F0FFF0240, 255, 240color: honeydew;-

hotpink#FF69B4255, 105, 180color: hotpink;-

indianred#CD5C5C205, 92, 92color: indianred;-

indigo#4B008275, 0, 130color: indigo;-

ivory#FFFFF0255, 255, 240color: ivory;-

khaki#F0E68C240, 230, 140color: khaki;-

lavender#E6E6FA230, 230, 250color: lavender;-

lavenderblush#FFF0F5255, 240, 245color: lavenderblush;-

lawngreen#7CFC00124, 252, 0color: lawngreen;-

lemonchiffon#FFFACD255, 250, 205color: lemonchiffon;-

lightblue#ADD8E6173, 216, 230color: lightblue;-

lightcoral#F08080240, 128, 128color: lightcoral;-

lightcyan#E0FFFF224, 255, 255color: lightcyan;-

lightgoldenrodyellow#FAFAD2250, 250, 210color: lightgoldenrodyellow;-

lightgray同色别名：lightgrey#D3D3D3211, 211, 211color: lightgray;与 lightgrey 为同色别名。

lightgreen#90EE90144, 238, 144color: lightgreen;-

lightgrey同色别名：lightgray#D3D3D3211, 211, 211color: lightgrey;与 lightgray 为同色别名。

lightpink#FFB6C1255, 182, 193color: lightpink;-

lightsalmon#FFA07A255, 160, 122color: lightsalmon;-

lightseagreen#20B2AA32, 178, 170color: lightseagreen;-

lightskyblue#87CEFA135, 206, 250color: lightskyblue;-

lightslategray同色别名：lightslategrey#778899119, 136, 153color: lightslategray;与 lightslategrey 为同色别名。

lightslategrey同色别名：lightslategray#778899119, 136, 153color: lightslategrey;与 lightslategray 为同色别名。

lightsteelblue#B0C4DE176, 196, 222color: lightsteelblue;-

lightyellow#FFFFE0255, 255, 224color: lightyellow;-

lime#00FF000, 255, 0color: lime;-

limegreen#32CD3250, 205, 50color: limegreen;-

linen#FAF0E6250, 240, 230color: linen;-

magenta同色别名：fuchsia#FF00FF255, 0, 255color: magenta;与 fuchsia 为同色别名。

maroon#800000128, 0, 0color: maroon;-

mediumaquamarine#66CDAA102, 205, 170color: mediumaquamarine;-

mediumblue#0000CD0, 0, 205color: mediumblue;-

mediumorchid#BA55D3186, 85, 211color: mediumorchid;-

mediumpurple#9370DB147, 112, 219color: mediumpurple;-

mediumseagreen#3CB37160, 179, 113color: mediumseagreen;-

mediumslateblue#7B68EE123, 104, 238color: mediumslateblue;-

mediumspringgreen#00FA9A0, 250, 154color: mediumspringgreen;-

mediumturquoise#48D1CC72, 209, 204color: mediumturquoise;-

mediumvioletred#C71585199, 21, 133color: mediumvioletred;-

midnightblue#19197025, 25, 112color: midnightblue;-

mintcream#F5FFFA245, 255, 250color: mintcream;-

mistyrose#FFE4E1255, 228, 225color: mistyrose;-

moccasin#FFE4B5255, 228, 181color: moccasin;-

navajowhite#FFDEAD255, 222, 173color: navajowhite;-

navy#0000800, 0, 128color: navy;-

oldlace#FDF5E6253, 245, 230color: oldlace;-

olive#808000128, 128, 0color: olive;-

olivedrab#6B8E23107, 142, 35color: olivedrab;-

orange#FFA500255, 165, 0color: orange;-

orangered#FF4500255, 69, 0color: orangered;-

orchid#DA70D6218, 112, 214color: orchid;-

palegoldenrod#EEE8AA238, 232, 170color: palegoldenrod;-

palegreen#98FB98152, 251, 152color: palegreen;-

paleturquoise#AFEEEE175, 238, 238color: paleturquoise;-

palevioletred#DB7093219, 112, 147color: palevioletred;-

papayawhip#FFEFD5255, 239, 213color: papayawhip;-

peachpuff#FFDAB9255, 218, 185color: peachpuff;-

peru#CD853F205, 133, 63color: peru;-

pink#FFC0CB255, 192, 203color: pink;-

plum#DDA0DD221, 160, 221color: plum;-

powderblue#B0E0E6176, 224, 230color: powderblue;-

purple#800080128, 0, 128color: purple;-

rebeccapurple#663399102, 51, 153color: rebeccapurple;-

red#FF0000255, 0, 0color: red;-

rosybrown#BC8F8F188, 143, 143color: rosybrown;-

royalblue#4169E165, 105, 225color: royalblue;-

saddlebrown#8B4513139, 69, 19color: saddlebrown;-

salmon#FA8072250, 128, 114color: salmon;-

sandybrown#F4A460244, 164, 96color: sandybrown;-

seagreen#2E8B5746, 139, 87color: seagreen;-

seashell#FFF5EE255, 245, 238color: seashell;-

sienna#A0522D160, 82, 45color: sienna;-

silver#C0C0C0192, 192, 192color: silver;-

skyblue#87CEEB135, 206, 235color: skyblue;-

slateblue#6A5ACD106, 90, 205color: slateblue;-

slategray同色别名：slategrey#708090112, 128, 144color: slategray;与 slategrey 为同色别名。

slategrey同色别名：slategray#708090112, 128, 144color: slategrey;与 slategray 为同色别名。

snow#FFFAFA255, 250, 250color: snow;-

springgreen#00FF7F0, 255, 127color: springgreen;-

steelblue#4682B470, 130, 180color: steelblue;-

tan#D2B48C210, 180, 140color: tan;-

teal#0080800, 128, 128color: teal;-

thistle#D8BFD8216, 191, 216color: thistle;-

tomato#FF6347255, 99, 71color: tomato;-

turquoise#40E0D064, 224, 208color: turquoise;-

violet#EE82EE238, 130, 238color: violet;-

wheat#F5DEB3245, 222, 179color: wheat;-

white#FFFFFF255, 255, 255color: white;-

whitesmoke#F5F5F5245, 245, 245color: whitesmoke;-

yellow#FFFF00255, 255, 0color: yellow;-

yellowgreen#9ACD32154, 205, 50color: yellowgreen;-

如何使用命名颜色

命名颜色适合快速写样式，也适合在示例、演示页面和轻量界面里直接使用。

可以直接写成 color: tomato; 或 background-color: aliceblue;。
如果项目已经有设计规范，正式业务色更建议统一使用变量或明确的 HEX 值。
像 rebeccapurple、royalblue、seagreen 这类名称更适合语义清晰的示例或原型页面。

别名说明

部分 CSS 命名颜色虽然名字不同，但本质上是同一组 RGB 数值。

aqua 和 cyan 是同色别名。
fuchsia 和 magenta 是同色别名。
gray / grey 以及 darkgray / darkgrey、slategray / slategrey 也是同色别名。

适合哪些场景

命名颜色最适合快速开发、教学示例、原型验证和样式实验。

想快速给标题、按钮或提示色命名时，直接使用命名颜色更直观。
编写教程、代码示例或组件文档时，命名颜色通常比纯数字色值更易读。
如果页面需要严格品牌色控制，还是建议最终落到设计系统里的变量和色板。

CSS 颜色名称表

快速查询

如何使用命名颜色

别名说明

适合哪些场景

相关工具