web安全色

Web上的颜色运用，对于设计师来说是小菜一碟，对于不是设计师来说还真是头痛的事情。打个比方说，Web的安全色是什么？或者说Web的安全色有多少？说实话，我以前只知道一个数字216，但我不知道具体是什么？今天为大家整理了216个web安全颜色，仅供大家参考。

Web安全色产生的原因

不同的平台（Mac、PC等）有不同的调色板，不同的浏览器也有自己的调色板。这就意味着对于一幅图，显示在Mac上的Web浏览器中的图像，与它在PC上相同浏览器中显示的效果可能差别很大。选择特定的颜色时，浏览器会尽量使用[2]本身所用的调色板中最接近的颜色。如果浏览器中没有所选的颜色，就会通过抖动或者混合自身的颜色来尝试重新产生该颜色

Web安全色的产生

为了解决Web调色板的问题，人们一致通过了一组在所有浏览器中都类似的Web安全颜色。这些颜色使用了一种颜色模型，在该模型中，可以用相应的16制进制值00、33、66、99、CC和FF来表达三原色（RGB）中的每一种。这种基本的Web调色板将作为所有的Web浏览器和平台的标准，它包括了这些16进制值的组合结果。这就意味着，我们潜在的输出结果包括6种红色调、6种绿色调、6种蓝色调。6*6*6的结果就给出了216种特定的颜色，这些颜色就可以安全的应用于所有的Web中，而不需要担心颜色在不同应用程序之间的变化。

Web安全色的应用

对于我们来说，将某种颜色的10进制值转化为16进制值不是一件容易的事情，尽管我们可以学会将RGB颜色转化为16进制的数学原理。

但是我们使用大多数图像编辑或者绘画程序中提供的颜色转化工具进行转化更为容易。通过使用滴管工具，可以在任何所需的颜色上单击，然后再颜色的拾取器中查看该颜色的RGB、HSB、CMYK、LAB和最终16进制数值。

在HTML里，颜色有两种表示方式。一种是用颜色名称表示，比如blue表示蓝色。另外一种是用16进制的数值表示RGB的颜色值。RGB是Red，Green，Blue意思，RGB每个原色的最小值是0，最大值是255，如果换算成16进制表示，就是(#00)，(#FF)。比如白色的RGB(255,255,255)，就用#FFFFFF表示；还有黑色的RGB(0,0,0)，就用#000000表示。

注：在W3C制定的HTML 4.0标准中，只有16种颜色可以用颜色名称表示(aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow)，其它的颜色都要用16进制RGB颜色值表示。

Web安全色的详细列表

以前，很多电脑显示器最多支持256色，因此出现了216种Web安全颜色，以保证网页的颜色能够正确显示。之所以不是256种Web安全颜色，是因为Microsoft和Mac操作系统有40种不同的系统保留颜色。

以下就是Web中216种安全颜色的信息示意图：

216 Web Safe Colors

HTML#000000RGB0 0 0

HTML#000033RGB0 0 51

HTML#000066RGB0 0 102

HTML#000099RGB0 0 153

HTML#0000CCRGB0 0 204

HTML#0000FFRGB0 0 255

HTML#003300RGB0 51 0

HTML#003333RGB0 51 51

HTML#003366RGB0 51 102

HTML#003399RGB0 51 153

HTML#0033CCRGB0 51 204

HTML#0033FFRGB0 51 255

HTML#006600RGB0 102 0

HTML#006633RGB0 102 51

HTML#006666RGB0 102 102

HTML#006699RGB0 102 153

HTML#0066CCRGB0 102 204

HTML#0066FFRGB0 102 255

HTML#009900RGB0 153 0

HTML#009933RGB0 153 51

HTML#009966RGB0 153 102

HTML#009999RGB0 153 153

HTML#0099CCRGB0 153 204

HTML#0099FFRGB0 153 255

HTML#00CC00RGB0 204 0

HTML#00CC33RGB0 204 51

HTML#00CC66RGB0 204 102

HTML#00CC99RGB0 204 153

HTML#00CCCCRGB0 204 204

HTML#00CCFFRGB0 204 255

HTML#00FF00RGB0 255 0

HTML#00FF33RGB0 255 51

HTML#00FF66RGB0 255 102

HTML#00FF99RGB0 255 153

HTML#00FFCCRGB0 255 204

HTML#00FFFFRGB0 255 255

HTML#330000RGB51 0 0

HTML#330033RGB51 0 51

HTML#330066RGB51 0 102

HTML#330099RGB51 0 153

HTML#3300CCRGB51 0 204

HTML#3300FFRGB51 0 255

HTML#333300RGB51 51 0

HTML#333333RGB51 51 51

HTML#333366RGB51 51 102

HTML#333399RGB51 51 153

HTML#3333CCRGB51 51 204

HTML#3333FFRGB51 51 255

HTML#336600RGB51 102 0

HTML#336633RGB51 102 51

HTML#336666RGB51 102 102

HTML#336699RGB51 102 153

HTML#3366CCRGB51 102 204

HTML#3366FFRGB51 102 255

HTML#339900RGB51 153 0

HTML#339933RGB51 153 51

HTML#339966RGB51 153 102

HTML#339999RGB51 153 153

HTML#3399CCRGB51 153 204

HTML#3399FFRGB51 153 255

HTML#33CC00RGB51 204 0

HTML#33CC33RGB51 204 51

HTML#33CC66RGB51 204 102

HTML#33CC99RGB51 204 153

HTML#33CCCCRGB51 204 204

HTML#33CCFFRGB51 204 255

HTML#33FF00RGB51 255 0

HTML#33FF33RGB51 255 51

HTML#33FF66RGB51 255 102

HTML#33FF99RGB51 255 153

HTML#33FFCCRGB51 255 204

HTML#33FFFFRGB51 255 255

HTML#660000RGB102 0 0

HTML#660033RGB102 0 51

HTML#660066RGB102 0 102

HTML#660099RGB102 0 153

HTML#6600CCRGB102 0 204

HTML#6600FFRGB102 0 255

HTML#663300RGB102 51 0

HTML#663333RGB102 51 51

HTML#663366RGB102 51 102

HTML#663399RGB102 51 153

HTML#6633CCRGB102 51 204

HTML#6633FFRGB102 51 255

HTML#666600RGB102 102 0

HTML#666633RGB102 102 51

HTML#666666RGB102 102 102

HTML#666699RGB102 102 153

HTML#6666CCRGB102 102 204

HTML#6666FFRGB102 102 255

HTML#669900RGB102 153 0

HTML#669933RGB102 153 51

HTML#669966RGB102 153 102

HTML#669999RGB102 153 153

HTML#6699CCRGB102 153 204

HTML#6699FFRGB102 153 255

HTML#66CC00RGB102 204 0

HTML#66CC33RGB102 204 51

HTML#66CC66RGB102 204 102

HTML#66CC99RGB102 204 153

HTML#66CCCCRGB102 204 204

HTML#66CCFFRGB102 204 255

HTML#66FF00RGB102 255 0

HTML#66FF33RGB102 255 51

HTML#66FF66RGB102 255 102

HTML#66FF99RGB102 255 153

HTML#66FFCCRGB102 255 204

HTML#66FFFFRGB102 255 255

HTML#990000RGB153 0 0

HTML#990033RGB153 0 51

HTML#990066RGB153 0 102

HTML#990099RGB153 0 153

HTML#9900CCRGB153 0 204

HTML#9900FFRGB153 0 255

HTML#993300RGB153 51 0

HTML#993333RGB153 51 51

HTML#993366RGB153 51 102

HTML#993399RGB153 51 153

HTML#9933CCRGB153 51 204

HTML#9933FFRGB153 51 255

HTML#996600RGB153 102 0

HTML#996633RGB153 102 51

HTML#996666RGB153 102 102

HTML#996699RGB153 102 153

HTML#9966CCRGB153 102 204

HTML#9966FFRGB153 102 255

HTML#999900RGB153 153 0

HTML#999933RGB153 153 51

HTML#999966RGB153 153 102

HTML#999999RGB153 153 153

HTML#9999CCRGB153 153 204

HTML#9999FFRGB153 153 255

HTML#99CC00RGB153 204 0

HTML#99CC33RGB153 204 51

HTML#99CC66RGB153 204 102

HTML#99CC99RGB153 204 153

HTML#99CCCCRGB153 204 204

HTML#99CCFFRGB153 204 255

HTML#99FF00RGB153 255 0

HTML#99FF33RGB153 255 51

HTML#99FF66RGB153 255 102

HTML#99FF99RGB153 255 153

HTML#99FFCCRGB153 255 204

HTML#99FFFFRGB153 255 255

HTML#CC0000RGB204 0 0

HTML#CC0033RGB204 0 51

HTML#CC0066RGB204 0 102

HTML#CC0099RGB204 0 153

HTML#CC00CCRGB204 0 204

HTML#CC00FFRGB204 0 255

HTML#CC3300RGB204 51 0

HTML#CC3333RGB204 51 51

HTML#CC3366RGB204 51 102

HTML#CC3399RGB204 51 153

HTML#CC33CCRGB204 51 204

HTML#CC33FFRGB204 51 255

HTML#CC6600RGB204 102 0

HTML#CC6633RGB204 102 51

HTML#CC6666RGB204 102 102

HTML#CC6699RGB204 102 153

HTML#CC66CCRGB204 102 204

HTML#CC66FFRGB204 102 255

HTML#CC9900RGB204 153 0

HTML#CC9933RGB204 153 51

HTML#CC9966RGB204 153 102

HTML#CC9999RGB204 153 153

HTML#CC99CCRGB204 153 204

HTML#CC99FFRGB204 153 255

HTML#CCCC00RGB204 204 0

HTML#CCCC33RGB204 204 51

HTML#CCCC66RGB204 204 102

HTML#CCCC99RGB204 204 153

HTML#CCCCCCRGB204 204 204

HTML#CCCCFFRGB204 204 255

HTML#CCFF00RGB204 255 0

HTML#CCFF33RGB204 255 51

HTML#CCFF66RGB204 255 102

HTML#CCFF99RGB204 255 153

HTML#CCFFCCRGB204 255 204

HTML#CCFFFFRGB204 255 255

HTML#FF0000RGB255 0 0

HTML#FF0033RGB255 0 51

HTML#FF0066RGB255 0 102

HTML#FF0099RGB255 0 153

HTML#FF00CCRGB255 0 204

HTML#FF00FFRGB255 0 255

HTML#FF3300RGB255 51 0

HTML#FF3333RGB255 51 51

HTML#FF3366RGB255 51 102

HTML#FF3399RGB255 51 153

HTML#FF33CCRGB255 51 204

HTML#FF33FFRGB255 51 255

HTML#FF6600RGB255 102 0

HTML#FF6633RGB255 102 51

HTML#FF6666RGB255 102 102

HTML#FF6699RGB255 102 153

HTML#FF66CCRGB255 102 204

HTML#FF66FFRGB255 102 255

HTML#FF9900RGB255 153 0

HTML#FF9933RGB255 153 51

HTML#FF9966RGB255 153 102

HTML#FF9999RGB255 153 153

HTML#FF99CCRGB255 153 204

HTML#FF99FFRGB255 153 255

HTML#FFCC00RGB255 204 0

HTML#FFCC33RGB255 204 51

HTML#FFCC66RGB255 204 102

HTML#FFCC99RGB255 204 153

HTML#FFCCCCRGB255 204 204

HTML#FFCCFFRGB255 204 255

HTML#FFFF00RGB255 255 0

HTML#FFFF33RGB255 255 51

HTML#FFFF66RGB255 255 102

HTML#FFFF99RGB255 255 153

HTML#FFFFCCRGB255 255 204

HTML#FFFFFFRGB255 255 255

Greens / Blues

HTML#000000RGB0 0 0

HTML#000033RGB0 0 51

HTML#000066RGB0 0 102

HTML#000099RGB0 0 153

HTML#0000CCRGB0 0 204

HTML#0000FFRGB0 0 255

HTML#003300RGB0 51 0

HTML#003333RGB0 51 51

HTML#003366RGB0 51 102

HTML#003399RGB0 51 153

HTML#0033CCRGB0 51 204

HTML#0033FFRGB0 51 255

HTML#006600RGB0 102 0

HTML#006633RGB0 102 51

HTML#006666RGB0 102 102

HTML#006699RGB0 102 153

HTML#0066CCRGB0 102 204

HTML#0066FFRGB0 102 255

HTML#009900RGB0 153 0

HTML#009933RGB0 153 51

HTML#009966RGB0 153 102

HTML#009999RGB0 153 153

HTML#0099CCRGB0 153 204

HTML#0099FFRGB0 153 255

HTML#00CC00RGB0 204 0

HTML#00CC33RGB0 204 51

HTML#00CC66RGB0 204 102

HTML#00CC99RGB0 204 153

HTML#00CCCCRGB0 204 204

HTML#00CCFFRGB0 204 255

HTML#00FF00RGB0 255 0

HTML#00FF33RGB0 255 51

HTML#00FF66RGB0 255 102

HTML#00FF99RGB0 255 153

HTML#00FFCCRGB0 255 204

HTML#00FFFFRGB0 255 255

Reds / Blues

HTML#000000RGB0 0 0

HTML#000033RGB0 0 51

HTML#000066RGB0 0 102

HTML#000099RGB0 0 153

HTML#0000CCRGB0 0 204

HTML#0000FFRGB0 0 255

HTML#330000RGB51 0 0

HTML#330033RGB51 0 51

HTML#330066RGB51 0 102

HTML#330099RGB51 0 153

HTML#3300CCRGB51 0 204

HTML#3300FFRGB51 0 255

HTML#660000RGB102 0 0

HTML#660033RGB102 0 51

HTML#660066RGB102 0 102

HTML#660099RGB102 0 153

HTML#6600CCRGB102 0 204

HTML#6600FFRGB102 0 255

HTML#990000RGB153 0 0

HTML#990033RGB153 0 51

HTML#990066RGB153 0 102

HTML#990099RGB153 0 153

HTML#9900CCRGB153 0 204

HTML#9900FFRGB153 0 255

HTML#CC0000RGB204 0 0

HTML#CC0033RGB204 0 51

HTML#CC0066RGB204 0 102

HTML#CC0099RGB204 0 153

HTML#CC00CCRGB204 0 204

HTML#CC00FFRGB204 0 255

HTML#FF0000RGB255 0 0

HTML#FF0033RGB255 0 51

HTML#FF0066RGB255 0 102

HTML#FF0099RGB255 0 153

HTML#FF00CCRGB255 0 204

HTML#FF00FFRGB255 0 255

Reds / Greens

HTML#000000RGB0 0 0

HTML#003300RGB0 51 0

HTML#006600RGB0 102 0

HTML#009900RGB0 153 0

HTML#00CC00RGB0 204 0

HTML#00FF00RGB0 255 0

HTML#330000RGB51 0 0

HTML#333300RGB51 51 0

HTML#336600RGB51 102 0

HTML#339900RGB51 153 0

HTML#33CC00RGB51 204 0

HTML#33FF00RGB51 255 0

HTML#660000RGB102 0 0

HTML#663300RGB102 51 0

HTML#666600RGB102 102 0

HTML#669900RGB102 153 0

HTML#66CC00RGB102 204 0

HTML#66FF00RGB102 255 0

HTML#990000RGB153 0 0

HTML#993300RGB153 51 0

HTML#996600RGB153 102 0

HTML#999900RGB153 153 0

HTML#99CC00RGB153 204 0

HTML#99FF00RGB153 255 0

HTML#CC0000RGB204 0 0

HTML#CC3300RGB204 51 0

HTML#CC6600RGB204 102 0

HTML#CC9900RGB204 153 0

HTML#CCCC00RGB204 204 0

HTML#CCFF00RGB204 255 0

HTML#FF0000RGB255 0 0

HTML#FF3300RGB255 51 0

HTML#FF6600RGB255 102 0

HTML#FF9900RGB255 153 0

HTML#FFCC00RGB255 204 0

HTML#FFFF00RGB255 255 0

Greys

HTML#000000RGB0 0 0

HTML#111111RGB17 17 17

HTML#222222RGB34 34 34

HTML#333333RGB51 51 51

HTML#444444RGB68 68 68

HTML#555555RGB85 85 85

HTML#666666RGB102 102 102

HTML#777777RGB119 119 119

HTML#888888RGB136 136 136

HTML#999999RGB153 153 153

HTML#AAAAAARGB170 170 170

HTML#BBBBBBRGB187 187 187

HTML#CCCCCCRGB204 204 204

HTML#DDDDDDRGB221 221 221

HTML#EEEEEERGB238 238 238

HTML#FFFFFFRGB255 255 255

Earth Tones

HTML#333333RGB51 51 51

HTML#333366RGB51 51 102

HTML#333399RGB51 51 153

HTML#3333CCRGB51 51 204

HTML#336633RGB51 102 51

HTML#336666RGB51 102 102

HTML#336699RGB51 102 153

HTML#3366CCRGB51 102 204

HTML#339933RGB51 153 51

HTML#339966RGB51 153 102

HTML#339999RGB51 153 153

HTML#3399CCRGB51 153 204

HTML#33CC33RGB51 204 51

HTML#33CC66RGB51 204 102

HTML#33CC99RGB51 204 153

HTML#33CCCCRGB51 204 204

HTML#663333RGB102 51 51

HTML#663366RGB102 51 102

HTML#663399RGB102 51 153

HTML#6633CCRGB102 51 204

HTML#666633RGB102 102 51

HTML#666666RGB102 102 102

HTML#666699RGB102 102 153

HTML#6666CCRGB102 102 204

HTML#669933RGB102 153 51

HTML#669966RGB102 153 102

HTML#669999RGB102 153 153

HTML#6699CCRGB102 153 204

HTML#66CC33RGB102 204 51

HTML#66CC66RGB102 204 102

HTML#66CC99RGB102 204 153

HTML#66CCCCRGB102 204 204

HTML#993333RGB153 51 51

HTML#993366RGB153 51 102

HTML#993399RGB153 51 153

HTML#9933CCRGB153 51 204

HTML#996633RGB153 102 51

HTML#996666RGB153 102 102

HTML#996699RGB153 102 153

HTML#9966CCRGB153 102 204

HTML#999933RGB153 153 51

HTML#999966RGB153 153 102

HTML#999999RGB153 153 153

HTML#9999CCRGB153 153 204

HTML#99CC33RGB153 204 51

HTML#99CC66RGB153 204 102

HTML#99CC99RGB153 204 153

HTML#99CCCCRGB153 204 204

HTML#CC3333RGB204 51 51

HTML#CC3366RGB204 51 102

HTML#CC3399RGB204 51 153

HTML#CC33CCRGB204 51 204

HTML#CC6633RGB204 102 51

HTML#CC6666RGB204 102 102

HTML#CC6699RGB204 102 153

HTML#CC66CCRGB204 102 204

HTML#CC9933RGB204 153 51

HTML#CC9966RGB204 153 102

HTML#CC9999RGB204 153 153

HTML#CC99CCRGB204 153 204

HTML#CCCC33RGB204 204 51

HTML#CCCC66RGB204 204 102

HTML#CCCC99RGB204 204 153

HTML#CCCCCCRGB204 204 204

Pastels

HTML#666666RGB102 102 102

HTML#666699RGB102 102 153

HTML#6666CCRGB102 102 204

HTML#6666FFRGB102 102 255

HTML#669966RGB102 153 102

HTML#669999RGB102 153 153

HTML#6699CCRGB102 153 204

HTML#6699FFRGB102 153 255

HTML#66CC66RGB102 204 102

HTML#66CC99RGB102 204 153

HTML#66CCCCRGB102 204 204

HTML#66CCFFRGB102 204 255

HTML#66FF66RGB102 255 102

HTML#66FF99RGB102 255 153

HTML#66FFCCRGB102 255 204

HTML#66FFFFRGB102 255 255

HTML#996666RGB153 102 102

HTML#996699RGB153 102 153

HTML#9966CCRGB153 102 204

HTML#9966FFRGB153 102 255

HTML#999966RGB153 153 102

HTML#999999RGB153 153 153

HTML#9999CCRGB153 153 204

HTML#9999FFRGB153 153 255

HTML#99CC66RGB153 204 102

HTML#99CC99RGB153 204 153

HTML#99CCCCRGB153 204 204

HTML#99CCFFRGB153 204 255

HTML#99FF66RGB153 255 102

HTML#99FF99RGB153 255 153

HTML#99FFCCRGB153 255 204

HTML#99FFFFRGB153 255 255

HTML#CC6666RGB204 102 102

HTML#CC6699RGB204 102 153

HTML#CC66CCRGB204 102 204

HTML#CC66FFRGB204 102 255

HTML#CC9966RGB204 153 102

HTML#CC9999RGB204 153 153

HTML#CC99CCRGB204 153 204

HTML#CC99FFRGB204 153 255

HTML#CCCC66RGB204 204 102

HTML#CCCC99RGB204 204 153

HTML#CCCCCCRGB204 204 204

HTML#CCCCFFRGB204 204 255

HTML#CCFF66RGB204 255 102

HTML#CCFF99RGB204 255 153

HTML#CCFFCCRGB204 255 204

HTML#CCFFFFRGB204 255 255

HTML#FF6666RGB255 102 102

HTML#FF6699RGB255 102 153

HTML#FF66CCRGB255 102 204

HTML#FF66FFRGB255 102 255

HTML#FF9966RGB255 153 102

HTML#FF9999RGB255 153 153

HTML#FF99CCRGB255 153 204

HTML#FF99FFRGB255 153 255

HTML#FFCC66RGB255 204 102

HTML#FFCC99RGB255 204 153

HTML#FFCCCCRGB255 204 204

HTML#FFCCFFRGB255 204 255

HTML#FFFF66RGB255 255 102

HTML#FFFF99RGB255 255 153

HTML#FFFFCCRGB255 255 204

HTML#FFFFFFRGB255 255 255

如需转载，烦请注明出处：http://www.w3cplus.com/css/216-web-safe-color-info.html