< color
本页面为 CSS 颜色和 Material Design 颜色的所有列表。
CSS
斜体名称为受到支持但不会显示的别名。
CSS1
| 名称 | Hex | 颜色 |
|---|---|---|
black |
#000000 |
|
silver |
#c0c0c0 |
|
gray |
#808080 |
|
white |
#ffffff |
|
maroon |
#800000 |
|
red |
#ff0000 |
|
purple |
#800080 |
|
fuchsia |
#ff00ff |
|
green |
#008000 |
|
lime |
#00ff00 |
|
olive |
#808000 |
|
yellow |
#ffff00 |
|
navy |
#000080 |
|
blue |
#0000ff |
|
teal |
#008080 |
|
aqua |
#00ffff |
CSS2
| 名称 | Hex | 颜色 |
|---|---|---|
orange |
#ffa500 |
CSS3
| 名称 | Hex | 颜色 |
|---|---|---|
aliceblue |
#f0f8ff |
|
antiquewhite |
#faebd7 |
|
aquamarine |
#7fffd4 |
|
azure |
#f0ffff |
|
beige |
#f5f5dc |
|
bisque |
#ffe4c4 |
|
blanchedalmond |
#ffebcd |
|
blueviolet |
#8a2be2 |
|
brown |
#a52a2a |
|
burlywood |
#deb887 |
|
cadetblue |
#5f9ea0 |
|
chartreuse |
#7fff00 |
|
chocolate |
#d2691e |
|
coral |
#ff7f50 |
|
cornflowerblue |
#6495ed |
|
cornsilk |
#fff8dc |
|
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 |
|
floralwhite |
#fffaf0 |
|
forestgreen |
#228b22 |
|
gainsboro |
#dcdcdc |
|
ghostwhite |
#f8f8ff |
|
gold |
#ffd700 |
|
goldenrod |
#daa520 |
|
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 |
#b0c4be |
|
lightyellow |
#ffffe0 |
|
limegreen |
#32cd32 |
|
linen |
#faf0e6 |
|
magenta |
#ff00ff |
|
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 |
|
oldlace |
#fdf5e6 |
|
olivedrab |
#6b8e23 |
|
orangered |
#ff4500 |
|
orchid |
#da70d6 |
|
palegoldenrod |
#eee8aa |
|
palegreen |
#98fb98 |
|
paleturquoise |
#afeeee |
|
palevioletred |
#db7093 |
|
papayawhip |
#ffefd5 |
|
peachpuff |
#ffdab9 |
|
peru |
#cd853f |
|
pink |
#ffc0cb |
|
plum |
#dda0dd |
|
powderblue |
#b0e0e6 |
|
rosybrown |
#bc8f8f |
|
royalblue |
#4169e1 |
|
saddlebrown |
#8b4513 |
|
salmon |
#fa8072 |
|
sandybrown |
#f4a460 |
|
seagreen |
#2e8b57 |
|
seashell |
#fff5ee |
|
sienna |
#a0522d |
|
skyblue |
#87ceeb |
|
slateblue |
#6a5acd |
|
slategray |
#708090 |
|
slategrey |
#708090 |
|
snow |
#fffafa |
|
springgreen |
#00ff7f |
|
steelblue |
#4682b4 |
|
tan |
#d2b48c |
|
thistle |
#d8bfd8 |
|
tomato |
#ff6347 |
|
turquoise |
#40e0d0 |
|
violet |
#ee82ee |
|
wheat |
#f5deb3 |
|
whitesmoke |
#f5f5f5 |
|
yellowgreen |
#9acd32 |
CSS4
| 名称 | Hex | 颜色 |
|---|---|---|
rebeccapurple |
#663399 |
Material Design
Material Design 颜色的颜色格式为<颜色名称>-<色号>。
red
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #ffebee |
|
| 100 | #ffcdd2 |
|
| 200 | #ef9a9a |
|
| 300 | #e57373 |
|
| 400 | #ef5350 |
|
| 500 | #f44336 |
|
| 600 | #e53935 |
|
| 700 | #d32f2f |
|
| 800 | #c62828 |
|
| 900 | #b71c1c |
|
| A100 | #ff8a80 |
|
| A200 | #ff5252 |
|
| A400 | #ff1744 |
|
| A700 | #d50000 |
pink
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #fce4ec |
|
| 100 | #f8bbd0 |
|
| 200 | #f48fb1 |
|
| 300 | #f06292 |
|
| 400 | #ec407a |
|
| 500 | #e91e63 |
|
| 600 | #d81b60 |
|
| 700 | #c2185b |
|
| 800 | #ad1457 |
|
| 900 | #880e4f |
|
| A100 | #ff80ab |
|
| A200 | #ff4081 |
|
| A400 | #f50057 |
|
| A700 | #c51162 |
purple
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #f3e5f5 |
|
| 100 | #e1bee7 |
|
| 200 | #ce93d8 |
|
| 300 | #ba68c8 |
|
| 400 | #ab47bc |
|
| 500 | #9c27b0 |
|
| 600 | #8e24aa |
|
| 700 | #7b1fa2 |
|
| 800 | #6a1b9a |
|
| 900 | #4a148c |
|
| A100 | #ea80fc |
|
| A200 | #e040fb |
|
| A400 | #d500f9 |
|
| A700 | #aa00ff |
deeppurple
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #ede7f6 |
|
| 100 | #d1c4e9 |
|
| 200 | #b39ddb |
|
| 300 | #9575cd |
|
| 400 | #7e57c2 |
|
| 500 | #673ab7 |
|
| 600 | #5e35b1 |
|
| 700 | #512da8 |
|
| 800 | #4527a0 |
|
| 900 | #311b92 |
|
| A100 | #b388ff |
|
| A200 | #7c4dff |
|
| A400 | #651fff |
|
| A700 | #6200ea |
indigo
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #e8eaf6 |
|
| 100 | #c5cae9 |
|
| 200 | #9fa8da |
|
| 300 | #7986cb |
|
| 400 | #5c6bc0 |
|
| 500 | #3f51b5 |
|
| 600 | #3949ab |
|
| 700 | #303f9f |
|
| 800 | #283593 |
|
| 900 | #1a237e |
|
| A100 | #8c9eff |
|
| A200 | #536dfe |
|
| A400 | #3d5afe |
|
| A700 | #304ffe |
blue
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #e3f2fd |
|
| 100 | #bbdefb |
|
| 200 | #90caf9 |
|
| 300 | #64b5f6 |
|
| 400 | #42a5f5 |
|
| 500 | #2196f3 |
|
| 600 | #1e88e5 |
|
| 700 | #1976d2 |
|
| 800 | #1565c0 |
|
| 900 | #0d47a1 |
|
| A100 | #82b1ff |
|
| A200 | #448aff |
|
| A400 | #2979ff |
|
| A700 | #2962ff |
lightblue
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #e1f5fe |
|
| 100 | #b3e5fc |
|
| 200 | #81d4fa |
|
| 300 | #4fc3f7 |
|
| 400 | #29b6f6 |
|
| 500 | #03a9f4 |
|
| 600 | #039be5 |
|
| 700 | #0288d1 |
|
| 800 | #0277bd |
|
| 900 | #01579b |
|
| A100 | #80d8ff |
|
| A200 | #40c4ff |
|
| A400 | #00b0ff |
|
| A700 | #0091ea |
cyan
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #e0f7fa |
|
| 100 | #b2ebf2 |
|
| 200 | #80deea |
|
| 300 | #4dd0e1 |
|
| 400 | #26c6da |
|
| 500 | #00bcd4 |
|
| 600 | #00acc1 |
|
| 700 | #0097a7 |
|
| 800 | #00838f |
|
| 900 | #006064 |
|
| A100 | #84ffff |
|
| A200 | #18ffff |
|
| A400 | #00e5ff |
|
| A700 | #00b8d4 |
teal
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #e0f2f1 |
|
| 100 | #b2dfdb |
|
| 200 | #80cbc4 |
|
| 300 | #4db6ac |
|
| 400 | #26a69a |
|
| 500 | #009688 |
|
| 600 | #00897b |
|
| 700 | #00796b |
|
| 800 | #00695c |
|
| 900 | #004d40 |
|
| A100 | #a7ffeb |
|
| A200 | #64ffda |
|
| A400 | #1de9b6 |
|
| A700 | #00bfa5 |
green
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #e8f5e9 |
|
| 100 | #c8e6c9 |
|
| 200 | #a5d6a7 |
|
| 300 | #81c784 |
|
| 400 | #66bb6a |
|
| 500 | #4caf50 |
|
| 600 | #43a047 |
|
| 700 | #388e3c |
|
| 800 | #2e7d32 |
|
| 900 | #1b5e20 |
|
| A100 | #b9f6ca |
|
| A200 | #69f0ae |
|
| A400 | #00e676 |
|
| A700 | #00c853 |
lightgreen
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #f1f8e9 |
|
| 100 | #dcedc8 |
|
| 200 | #c5e1a5 |
|
| 300 | #aed581 |
|
| 400 | #9ccc65 |
|
| 500 | #8bc34a |
|
| 600 | #7cb342 |
|
| 700 | #689f38 |
|
| 800 | #558b2f |
|
| 900 | #33691e |
|
| A100 | #ccff90 |
|
| A200 | #b2ff59 |
|
| A400 | #76ff03 |
|
| A700 | #64dd17 |
lime
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #f9fbe7 |
|
| 100 | #f0f4c3 |
|
| 200 | #e6ee9c |
|
| 300 | #dce775 |
|
| 400 | #d4e157 |
|
| 500 | #cddc39 |
|
| 600 | #c0ca33 |
|
| 700 | #afb42b |
|
| 800 | #9e9d24 |
|
| 900 | #827717 |
|
| A100 | #f4ff81 |
|
| A200 | #eeff41 |
|
| A400 | #c6ff00 |
|
| A700 | #aeea00 |
yellow
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #fffde7 |
|
| 100 | #fff9c4 |
|
| 200 | #fff59d |
|
| 300 | #fff176 |
|
| 400 | #ffee58 |
|
| 500 | #ffeb3b |
|
| 600 | #fdd835 |
|
| 700 | #fbc02d |
|
| 800 | #f9a825 |
|
| 900 | #f57f17 |
|
| A100 | #ffff8d |
|
| A200 | #ffff00 |
|
| A400 | #ffea00 |
|
| A700 | #ffd600 |
amber
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #fff8e1 |
|
| 100 | #ffecb3 |
|
| 200 | #ffe082 |
|
| 300 | #ffd54f |
|
| 400 | #ffca28 |
|
| 500 | #ffc107 |
|
| 600 | #ffb300 |
|
| 700 | #ffa000 |
|
| 800 | #ff8f00 |
|
| 900 | #ff6f00 |
|
| A100 | #ffe57f |
|
| A200 | #ffd740 |
|
| A400 | #ffc400 |
|
| A700 | #ffab00 |
orange
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #fff3e0 |
|
| 100 | #ffe0b2 |
|
| 200 | #ffcc80 |
|
| 300 | #ffb74d |
|
| 400 | #ffa726 |
|
| 500 | #ff9800 |
|
| 600 | #fb8c00 |
|
| 700 | #f57c00 |
|
| 800 | #ef6c00 |
|
| 900 | #e65100 |
|
| A100 | #ffd180 |
|
| A200 | #ffab40 |
|
| A400 | #ff9100 |
|
| A700 | #ff6d00 |
deeporange
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #fbe9e7 |
|
| 100 | #ffccbc |
|
| 200 | #ffab91 |
|
| 300 | #ff8a65 |
|
| 400 | #ff7043 |
|
| 500 | #ff5722 |
|
| 600 | #f4511e |
|
| 700 | #e64a19 |
|
| 800 | #d84315 |
|
| 900 | #bf360c |
|
| A100 | #ff9e80 |
|
| A200 | #ff6e40 |
|
| A400 | #ff3d00 |
|
| A700 | #dd2c00 |
brown
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #efebe9 |
|
| 100 | #d7ccc8 |
|
| 200 | #bcaaa4 |
|
| 300 | #a1887f |
|
| 400 | #8d6e63 |
|
| 500 | #795548 |
|
| 600 | #6d4c41 |
|
| 700 | #5d4037 |
|
| 800 | #4e342e |
|
| 900 | #3e2723 |
grey
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #fafafa |
|
| 100 | #f5f5f5 |
|
| 200 | #eeeeee |
|
| 300 | #e0e0e0 |
|
| 400 | #bdbdbd |
|
| 500 | #9e9e9e |
|
| 600 | #757575 |
|
| 700 | #616161 |
|
| 800 | #424242 |
|
| 900 | #212121 |
bluegrey
| 色号 | Hex | 颜色 |
|---|---|---|
| 50 | #eceff1 |
|
| 100 | #cfd8dc |
|
| 200 | #b0bec5 |
|
| 300 | #90a4ae |
|
| 400 | #78909c |
|
| 500 | #607d8b |
|
| 600 | #546e7a |
|
| 700 | #455a64 |
|
| 800 | #37474f |
|
| 900 | #263238 |
其他
| 名称 | Hex | 颜色 |
|---|---|---|
black |
#000000 |
|
white |
#ffffff |