跳转至

青少年CTF文库

HTML 颜色名

qsnctf/qsnctf.github.io

CSS 颜色名参考¶

命名颜色是 CSS <named-color> 关键字，可用于 HTML 元素的 CSS 样式。名称不区分 ASCII 大小写；本页使用小写并按色系紧凑列出标准常见集合。

基本用法¶

.notice {
  color: navy;
  background-color: aliceblue;
  border: 2px solid steelblue;
}

黑白灰¶

名称	十六进制	名称	十六进制	名称	十六进制
`black`	`#000000`	`dimgray` / `dimgrey`	`#696969`	`gray` / `grey`	`#808080`
`darkgray` / `darkgrey`	`#a9a9a9`	`silver`	`#c0c0c0`	`lightgray` / `lightgrey`	`#d3d3d3`
`gainsboro`	`#dcdcdc`	`whitesmoke`	`#f5f5f5`	`white`	`#ffffff`
`snow`	`#fffafa`	`floralwhite`	`#fffaf0`	`ghostwhite`	`#f8f8ff`

红、粉与紫¶

名称	十六进制	名称	十六进制	名称	十六进制
`maroon`	`#800000`	`darkred`	`#8b0000`	`red`	`#ff0000`
`firebrick`	`#b22222`	`crimson`	`#dc143c`	`indianred`	`#cd5c5c`
`lightcoral`	`#f08080`	`salmon`	`#fa8072`	`darksalmon`	`#e9967a`
`lightsalmon`	`#ffa07a`	`tomato`	`#ff6347`	`orangered`	`#ff4500`
`pink`	`#ffc0cb`	`lightpink`	`#ffb6c1`	`hotpink`	`#ff69b4`
`deeppink`	`#ff1493`	`palevioletred`	`#db7093`	`mediumvioletred`	`#c71585`
`purple`	`#800080`	`darkmagenta`	`#8b008b`	`magenta` / `fuchsia`	`#ff00ff`
`indigo`	`#4b0082`	`darkviolet`	`#9400d3`	`darkorchid`	`#9932cc`
`mediumorchid`	`#ba55d3`	`orchid`	`#da70d6`	`violet`	`#ee82ee`
`plum`	`#dda0dd`	`thistle`	`#d8bfd8`	`lavender`	`#e6e6fa`
`blueviolet`	`#8a2be2`	`mediumpurple`	`#9370db`	`rebeccapurple`	`#663399`

橙、黄与棕¶

名称	十六进制	名称	十六进制	名称	十六进制
`orange`	`#ffa500`	`darkorange`	`#ff8c00`	`coral`	`#ff7f50`
`gold`	`#ffd700`	`yellow`	`#ffff00`	`lightyellow`	`#ffffe0`
`lemonchiffon`	`#fffacd`	`lightgoldenrodyellow`	`#fafad2`	`papayawhip`	`#ffefd5`
`moccasin`	`#ffe4b5`	`peachpuff`	`#ffdab9`	`palegoldenrod`	`#eee8aa`
`khaki`	`#f0e68c`	`darkkhaki`	`#bdb76b`	`goldenrod`	`#daa520`
`darkgoldenrod`	`#b8860b`	`cornsilk`	`#fff8dc`	`blanchedalmond`	`#ffebcd`
`bisque`	`#ffe4c4`	`navajowhite`	`#ffdead`	`wheat`	`#f5deb3`
`tan`	`#d2b48c`	`burlywood`	`#deb887`	`sandybrown`	`#f4a460`
`peru`	`#cd853f`	`chocolate`	`#d2691e`	`sienna`	`#a0522d`
`saddlebrown`	`#8b4513`	`brown`	`#a52a2a`	`rosybrown`	`#bc8f8f`

绿与青¶

名称	十六进制	名称	十六进制	名称	十六进制
`green`	`#008000`	`darkgreen`	`#006400`	`lime`	`#00ff00`
`limegreen`	`#32cd32`	`forestgreen`	`#228b22`	`seagreen`	`#2e8b57`
`mediumseagreen`	`#3cb371`	`springgreen`	`#00ff7f`	`mediumspringgreen`	`#00fa9a`
`greenyellow`	`#adff2f`	`chartreuse`	`#7fff00`	`lawngreen`	`#7cfc00`
`yellowgreen`	`#9acd32`	`olivedrab`	`#6b8e23`	`olive`	`#808000`
`darkolivegreen`	`#556b2f`	`mediumaquamarine`	`#66cdaa`	`aquamarine`	`#7fffd4`
`palegreen`	`#98fb98`	`lightgreen`	`#90ee90`	`honeydew`	`#f0fff0`
`teal`	`#008080`	`darkcyan`	`#008b8b`	`cyan` / `aqua`	`#00ffff`
`lightcyan`	`#e0ffff`	`paleturquoise`	`#afeeee`	`turquoise`	`#40e0d0`
`mediumturquoise`	`#48d1cc`	`darkturquoise`	`#00ced1`	`lightseagreen`	`#20b2aa`

蓝色¶

名称	十六进制	名称	十六进制	名称	十六进制
`navy`	`#000080`	`darkblue`	`#00008b`	`mediumblue`	`#0000cd`
`blue`	`#0000ff`	`midnightblue`	`#191970`	`royalblue`	`#4169e1`
`cornflowerblue`	`#6495ed`	`dodgerblue`	`#1e90ff`	`deepskyblue`	`#00bfff`
`lightskyblue`	`#87cefa`	`skyblue`	`#87ceeb`	`lightblue`	`#add8e6`
`powderblue`	`#b0e0e6`	`steelblue`	`#4682b4`	`lightsteelblue`	`#b0c4de`
`cadetblue`	`#5f9ea0`	`slateblue`	`#6a5acd`	`mediumslateblue`	`#7b68ee`
`darkslateblue`	`#483d8b`	`aliceblue`	`#f0f8ff`	`azure`	`#f0ffff`

中性浅色与深灰蓝¶

名称	十六进制	名称	十六进制	名称	十六进制
`beige`	`#f5f5dc`	`ivory`	`#fffff0`	`linen`	`#faf0e6`
`oldlace`	`#fdf5e6`	`seashell`	`#fff5ee`	`mintcream`	`#f5fffa`
`mistyrose`	`#ffe4e1`	`lavenderblush`	`#fff0f5`	`antiquewhite`	`#faebd7`
`darkslategray` / `darkslategrey`	`#2f4f4f`	`slategray` / `slategrey`	`#708090`	`lightslategray` / `lightslategrey`	`#778899`

特殊关键字与限制¶

transparent 表示完全透明的黑色，不是普通固定不透明颜色。
currentColor 取元素计算后的 color 值，属于颜色关键字但不是命名色。
canvas、canvastext 等系统颜色会跟随用户代理和系统主题，不在上表固定色值中。
同义名包括 aqua/cyan、fuchsia/magenta 以及多组 gray/grey。
名称不能说明可访问性；必须测量实际字号、字重、前景、背景和交互状态的对比度。
不只用颜色传达错误、成功或选中状态，应同时提供文字、图标或形状。

需要用户选择颜色时参见拾色器。精确品牌色通常用设计令牌和十六进制、RGB、HSL 或 OKLCH。