CSS3下的147个颜色名称及对应颜色值

这篇文章发布于 2010年08月30日,星期一,19:55,归类于 css相关。 阅读 103474 次, 今日 84 次

颜色名称也称为颜色关键字,像我们熟悉的black表示黑色,white表示白色,blue表示蓝色等。实际上,在CSS的颜色定义中,总共有147种颜色关键字,所有者147种颜色名字均取自X Windows 系统,X 颜色名,所以即使这147个颜色名看上去不是很标准,支持也是非常不错的。

需要注意的是,在IE下,关于灰色,其中的字母”e”是不认的,它只认gray中的”a”而不认grey中的”e”,所以IE浏览器下,CSS3中的颜色名实际上只有140个,而不是147个。

其他就不多说了,关于这147个颜色名称关键字,请看下表:

名称 16进制 百分值 整数值 16进制缩写 示例
aliceblue #f0f8ff rgb(94.1%,96.9%,100%) rgb(240,248,255)   Color Example
antiquewhite #faebd7 rgb(98%,92.2%,84.3%) rgb(250,235,215)   Color Example
aqua #00ffff rgb(0%,100%,100%) rgb(0,255,255) #0ff Color Example
aquamarine #7fffd4 rgb(49.8%,100%,83.1%) rgb(127,255,212)   Color Example
azure #f0ffff rgb(94.1%,100%,100%) rgb(240,255,255)   Color Example
beige #f5f5dc rgb(96.1%,96.1%,86.3%) rgb(245,245,220)   Color Example
bisque #ffe4c4 rgb(100%,89.4%,76.9%) rgb(255,228,196)   Color Example
black #000000 rgb(0%,0%,0%) rgb(0,0,0) #000 Color Example
blanchedalmond #ffebcd rgb(100%,92.2%,80.4%) rgb(255,235,205)   Color Example
blue #0000ff rgb(0%,0%,100%) rgb(0,0,255) #00f Color Example
blueviolet #8a2be2 rgb(54.1%,16.9%,88.6%) rgb(138,43,226)   Color Example
brown #a52a2a rgb(64.7%,16.5%,16.5%) rgb(165,42,42)   Color Example
burlywood #deb887 rgb(87.1%,72.2%,52.9%) rgb(222,184,135)   Color Example
cadetblue #5f9ea0 rgb(37.3%,62%,62.7%) rgb(95,158,160)   Color Example
chartreuse #7fff00 rgb(49.8%,100%,0%) rgb(127,255,0)   Color Example
chocolate #d2691e rgb(82.4%,41.1%,11.8%) rgb(210,105,30)   Color Example
coral #ff7f50 rgb(100%,49.8%,31.4%) rgb(255,127,80)   Color Example
cornflowerblue #6495ed rgb(39.2%,58.4%,92.9%) rgb(100,149,237)   Color Example
cornsilk #fff8dc rgb(100%,97.3%,86.3%) rgb(255,248,220)   Color Example
crimson #dc143c rgb(86.3%,7.8%,23.5%) rgb(220,20,60)   Color Example
cyan #00ffff rgb(0%,100%,100%) rgb(0,255,255) #0ff Color Example
darkblue #00008b rgb(0%,0%,54.5%) rgb(0,0,139)   Color Example
darkcyan #008b8b rgb(0%,54.5%,54.5%) rgb(0,139,139)   Color Example
darkgoldenrod #b8860b rgb(72.2%,52.5%,4.3%) rgb(184,134,11)   Color Example
darkgray #a9a9a9 rgb(66.3%,66.3%,66.3%) rgb(169,169,169)   Color Example
darkgreen #006400 rgb(0%,39.2%,0%) rgb(0,100,0)   Color Example
darkgrey #a9a9a9 rgb(66.3%,66.3%,66.3%) rgb(169,169,169)   Color Example
darkkhaki #bdb76b rgb(74.1%,71.8%,42%) rgb(189,183,107)   Color Example
darkmagenta #8b008b rgb(54.5%,0%,54.5%) rgb(139,0,139)   Color Example
darkolivegreen #556b2f rgb(33.3%,42%,18.4%) rgb(85,107,47)   Color Example
darkorange #ff8c00 rgb(100%,54.9%,0%) rgb(255,140,0)   Color Example
darkorchid #9932cc rgb(60%,19.6%,80%) rgb(153,50,204)   Color Example
darkred #8b0000 rgb(54.5%,0%,0%) rgb(139,0,0)   Color Example
darksalmon #e9967a rgb(91.4%,58.8%,47.8%) rgb(233,150,122)   Color Example
darkseagreen #8fbc8f rgb(56.1%,73.7%,56.1%) rgb(143,188,143)   Color Example
darkslateblue #483d8b rgb(28.2%,23.9%,54.5%) rgb(72,61,139)   Color Example
darkslategray #2f4f4f rgb(18.4%,31%,31%) rgb(47,79,79)   Color Example
darkslategrey #2f4f4f rgb(18.4%,31%,31%) rgb(47,79,79)   Color Example
darkturquoise #00ced1 rgb(0%,80.8%,82%) rgb(0,206,209)   Color Example
darkviolet #9400d3 rgb(58%,0%,82.7%) rgb(148,0,211)   Color Example
deeppink #ff1493 rgb(100%,7.8%,57.6%) rgb(255,20,147)   Color Example
deepskyblue #00bfff rgb(0%,74.9%,100%) rgb(0,191,255)   Color Example
dimgray #696969 rgb(41.1%,41.1%,41.1%) rgb(105,105,105)   Color Example
dimgrey #696969 rgb(41.1%,41.1%,41.1%) rgb(105,105,105)   Color Example
dodgerblue #1e90ff rgb(11.8%,56.5%,100%) rgb(30,144,255)   Color Example
firebrick #b22222 rgb(69.8%,13.3%,13.3%) rgb(178,34,34)   Color Example
floralwhite #fffaf0 rgb(100%,98%,94.1%) rgb(255,250,240)   Color Example
forestgreen #228b22 rgb(13.3%,54.5%,13.3%) rgb(34,139,34)   Color Example
fuchsia #ff00ff rgb(100%,0%,100%) rgb(255,0,255) #f0f Color Example
gainsboro #dcdcdc rgb(86.3%,86.3%,86.3%) rgb(220,220,220)   Color Example
ghostwhite #f8f8ff rgb(97.3%,97.3%,100%) rgb(248,248,255)   Color Example
gold #ffd700 rgb(100%,84.3%,0%) rgb(255,215,0)   Color Example
goldenrod #daa520 rgb(85.5%,64.7%,12.5%) rgb(218,165,32)   Color Example
gray #808080 rgb(50.2%,50.2%,50.2%) rgb(128,128,128)   Color Example
green #008000 rgb(0%,50.2%,0%) rgb(0,128,0)   Color Example
greenyellow #adff2f rgb(67.8%,100%,18.4%) rgb(173,255,47)   Color Example
grey #808080 rgb(50.2%,50.2%,50.2%) rgb(128,128,128)   Color Example
honeydew #f0fff0 rgb(94.1%,100%,94.1%) rgb(240,255,240)   Color Example
hotpink #ff69b4 rgb(100%,41.1%,70.6%) rgb(255,105,180)   Color Example
indianred #cd5c5c rgb(80.4%,36%,36%) rgb(205,92,92)   Color Example
indigo #4b0082 rgb(29.4%,0%,51%) rgb(75,0,130)   Color Example
ivory #fffff0 rgb(100%,100%,94.1%) rgb(255,255,240)   Color Example
khaki #f0e68c rgb(94.1%,90.2%,54.9%) rgb(240,230,140)   Color Example
lavender #e6e6fa rgb(90.2%,90.2%,98%) rgb(230,230,250)   Color Example
lavenderblush #fff0f5 rgb(100%,94.1%,96.1%) rgb(255,240,245)   Color Example
lawngreen #7cfc00 rgb(48.6%,98.8%,0%) rgb(124,252,0)   Color Example
lemonchiffon #fffacd rgb(100%,98%,80.4%) rgb(255,250,205)   Color Example
lightblue #add8e6 rgb(67.8%,84.7%,90.2%) rgb(173,216,230)   Color Example
lightcoral #f08080 rgb(94.1%,50.2%,50.2%) rgb(240,128,128)   Color Example
lightcyan #e0ffff rgb(87.8%,100%,100%) rgb(224,255,255)   Color Example
lightgoldenrodyellow #fafad2 rgb(98%,98%,82.4%) rgb(250,250,210)   Color Example
lightgray #d3d3d3 rgb(82.7%,82.7%,82.7%) rgb(211,211,211)   Color Example
lightgreen #90ee90 rgb(56.5%,93.3%,56.5%) rgb(144,238,144)   Color Example
lightgrey #d3d3d3 rgb(82.7%,82.7%,82.7%) rgb(211,211,211)   Color Example
lightpink #ffb6c1 rgb(100%,71.4%,75.7%) rgb(255,182,193)   Color Example
lightsalmon #ffa07a rgb(100%,62.7%,47.8%) rgb(255,160,122)   Color Example
lightseagreen #20b2aa rgb(12.5%,69.8%,66.7%) rgb(32,178,170)   Color Example
lightskyblue #87cefa rgb(52.9%,80.8%,98%) rgb(135,206,250)   Color Example
lightslategray #778899 rgb(46.7%,53.3%,60%) rgb(119,136,153) #789 Color Example
lightslategrey #778899 rgb(46.7%,53.3%,60%) rgb(119,136,153) #789 Color Example
lightsteelblue #b0c4de rgb(69%,76.9%,87.1%) rgb(176,196,222)   Color Example
lightyellow #ffffe0 rgb(100%,100%,87.8%) rgb(255,255,224)   Color Example
lime #00ff00 rgb(0%,100%,0%) rgb(0,255,0) #0f0 Color Example
limegreen #32cd32 rgb(19.6%,80.4%,19.6%) rgb(50,205,50)   Color Example
linen #faf0e6 rgb(98%,94.1%,90.2%) rgb(250,240,230)   Color Example
magenta #ff00ff rgb(100%,0%,100%) rgb(255,0,255) #f0f Color Example
maroon #800000 rgb(50.2%,0%,0%) rgb(128,0,0)   Color Example
mediumaquamarine #66cdaa rgb(40%,80.4%,66.7%) rgb(102,205,170)   Color Example
mediumblue #0000cd rgb(0%,0%,80.4%) rgb(0,0,205)   Color Example
mediumorchid #ba55d3 rgb(72.9%,33.3%,82.7%) rgb(186,85,211)   Color Example
mediumpurple #9370db rgb(57.6%,43.9%,85.9%) rgb(147,112,219)   Color Example
mediumseagreen #3cb371 rgb(23.5%,70.2%,44.3%) rgb(60,179,113)   Color Example
mediumslateblue #7b68ee rgb(48.2%,40.8%,93.3%) rgb(123,104,238)   Color Example
mediumspringgreen #00fa9a rgb(0%,98%,60.4%) rgb(0,250,154)   Color Example
mediumturquoise #48d1cc rgb(28.2%,82%,80%) rgb(72,209,204)   Color Example
mediumvioletred #c71585 rgb(78%,8.2%,52.2%) rgb(199,21,133)   Color Example
midnightblue #191970 rgb(9.8%,9.8%,43.9%) rgb(25,25,112)   Color Example
mintcream #f5fffa rgb(96.1%,100%,98%) rgb(245,255,250)   Color Example
mistyrose #ffe4e1 rgb(100%,89.4%,88.2%) rgb(255,228,225)   Color Example
moccasin #ffe4b5 rgb(100%,89.4%,71%) rgb(255,228,181)   Color Example
navajowhite #ffdead rgb(100%,87.1%,67.8%) rgb(255,222,173)   Color Example
navy #000080 rgb(0%,0%,50.2%) rgb(0,0,128)   Color Example
oldlace #fdf5e6 rgb(99.2%,96.1%,90.2%) rgb(253,245,230)   Color Example
olive #808000 rgb(50.2%,50.2%,0%) rgb(128,128,0)   Color Example
olivedrab #6b8e23 rgb(42%,55.7%,13.7%) rgb(107,142,35)   Color Example
orange #ffa500 rgb(100%,64.7%,0%) rgb(255,165,0)   Color Example
orangered #ff4500 rgb(100%,27.1%,0%) rgb(255,69,0)   Color Example
orchid #da70d6 rgb(85.5%,43.9%,83.9%) rgb(218,112,214)   Color Example
palegoldenrod #eee8aa rgb(93.3%,91%,66.7%) rgb(238,232,170)   Color Example
palegreen #98fb98 rgb(59.6%,98.4%,59.6%) rgb(152,251,152)   Color Example
paleturquoise #afeeee rgb(68.6%,93.3%,93.3%) rgb(175,238,238)   Color Example
palevioletred #db7093 rgb(85.9%,43.9%,57.6%) rgb(219,112,147)   Color Example
papayawhip #ffefd5 rgb(100%,93.7%,83.5%) rgb(255,239,213)   Color Example
peachpuff #ffdab9 rgb(100%,85.5%,72.5%) rgb(255,218,185)   Color Example
peru #cd853f rgb(80.4%,52.2%,24.7%) rgb(205,133,63)   Color Example
pink #ffc0cb rgb(100%,75.3%,79.6%) rgb(255,192,203)   Color Example
plum #dda0dd rgb(86.7%,62.7%,86.7%) rgb(221,160,221)   Color Example
powderblue #b0e0e6 rgb(69%,87.8%,90.2%) rgb(176,224,230)   Color Example
purple #800080 rgb(50.2%,0%,50.2%) rgb(128,0,128)   Color Example
red #ff0000 rgb(100%,0%,0%) rgb(255,0,0) #f00 Color Example
rosybrown #bc8f8f rgb(73.7%,56.1%,56.1%) rgb(188,143,143)   Color Example
royalblue #4169e1 rgb(25.5%,41.1%,100%) rgb(65,105,225)   Color Example
saddlebrown #8b4513 rgb(54.5%,27.1%,7.5%) rgb(139,69,19)   Color Example
salmon #fa8072 rgb(98%,50.2%,44.7%) rgb(250,128,114)   Color Example
sandybrown #f4a460 rgb(95.7%,64.3%,37.6%) rgb(244,164,96)   Color Example
seagreen #2e8b57 rgb(18%,54.5%,34.1%) rgb(46,139,87)   Color Example
seashell #fff5ee rgb(100%,96.1%,93.3%) rgb(255,245,238)   Color Example
sienna #a0522d rgb(62.7%,32.2%,17.6%) rgb(160,82,45)   Color Example
silver #c0c0c0 rgb(75.3%,75.3%,75.3%) rgb(192,192,192)   Color Example
skyblue #87ceeb rgb(52.9%,80.8%,92.2%) rgb(135,206,235)   Color Example
slateblue #6a5acd rgb(41.6%,35.3%,80.4%) rgb(106,90,205)   Color Example
slategray #708090 rgb(43.9%,50.2%,56.5%) rgb(112,128,144)   Color Example
slategrey #708090 rgb(43.9%,50.2%,56.5%) rgb(112,128,144)   Color Example
snow #fffafa rgb(100%,98%,98%) rgb(255,250,250)   Color Example
springgreen #00ff7f rgb(0%,100%,49.8%) rgb(0,255,127)   Color Example
steelblue #4682b4 rgb(27.5%,51%,70.6%) rgb(70,130,180)   Color Example
tan #d2b48c rgb(82.4%,70.6%,54.9%) rgb(210,180,140)   Color Example
teal #008080 rgb(0%,50.2%,50.2%) rgb(0,128,128)   Color Example
thistle #d8bfd8 rgb(84.7%,74.9%,84.7%) rgb(216,191,216)   Color Example
tomato #ff6347 rgb(100%,38.8%%,27.8%) rgb(255,99,71)   Color Example
turquoise #40e0d0 rgb(25.1%,87.7%,81.6%) rgb(64,224,208)   Color Example
violet #ee82ee rgb(93.3%,51%,93.3%) rgb(238,130,238)   Color Example
wheat #f5deb3 rgb(96.1%,87.1%,70.2%) rgb(245,222,179)   Color Example
white #ffffff rgb(100%,100%,100%) rgb(255,255,255) #fff Color Example
whitesmoke #f5f5f5 rgb(96.1%,96.1%,96.1%) rgb(245,245,245)   Color Example
yellow #ffff00 rgb(100%,100%,0%) rgb(255,255,0) #ff0 Color Example
yellowgreen #9acd32 rgb(60.4%,80.4%,19.6%) rgb(154,205,50)   Color Example

关于此表,我还专门独立出来了一个页面,专门用来放置这个表格,方面查阅与收藏,您有兴趣可以狠狠地点击这里:CSS3下的147个颜色名称独立页面

数据来源:http://www.codenique…es.php

(完)

分享到:

赞助商推荐(我也要赞助)

想学到点真东西? ×
如果你有1~3年前端开发经验,不妨 ×
想高薪入职阿里? ×
想通过真实互联网项目成长自己? ×


发表评论(目前3 条评论)

  1. 双如说道:

    前辈,我有一个问题。我有办法自己定义自己的颜色吗?

    比如我定义 beauty #F90,

    页面中用到的地方,我就写 color:beauty;

    等到我要换皮肤的时候,把顶上的这个 #F90 改一下。有多个值的时候,我就调整那几个值。

    诶,不知道现在本来的css有没有这个办法。此致敬礼。

    • 张 鑫旭说道:

      @双如 这有些类似Sass, Less, Stylus,你有兴趣可以研究研究。

    • 龙合正一说道:

      现在还没开始吧,不过我看有人做这方面的视频了,我用文字记录下来了,你可以看看http://www.w3cfuns.com/blog-5425789-5398338.html