网页颜色 技术专题简介

简介

Web Color ChartsHTMLHTML动态HTMLHTML5音频(英语:HTML5 Audio)画布视频(英语:HTML5 video)XHTML基础(英语:XHTML Basic)移动概要C-HTMLHTML元素Span与divHTML特性(英语:HTML attribute)HTML框架(英语:Framing (World Wide Web))HTML编辑器字符编码Unicode(英语:Unicode and HTML)语言代码文档对象模型浏览器对象模型样式表层叠样式表字体家族网页颜色HTML脚本(英语:HTML scripting)JavaScriptWebGLWebCL(英语:WebCL)W3C验证服务网页超文本应用技术工作小组怪异模式网页存储排版引擎比较文档标记语言网页浏览器HTML非标准HTMLHTML5(英语:Comparison of layout engines (HTML5))画布媒体XHTML1.1查论编网页颜色是设计网页时表示各种颜色的方法。颜色可以用三组十六进制数字表示,部分常用颜色或和上下文相关的内容也可以用英语名称的“关键字”来表示。此外还有直接使用多组十进制表示的方法。

十六进制数字表示方法

HTML和CSS用3字节共6位十六进制数字表示一种色,每字节从00到FF,相当十进位数字0到255,前两位是红色的值,中两位是绿色的值,后两位是蓝色的值。

网页是基于计算机浏览器开发的媒体,颜色以光学颜色RGB(红、绿、蓝)为主。网页颜色以16进制代码表示,一般以“#”号开头,后面分别为R、G、B的16位进制数。FF最大,代表十进制255。比如白色是R、G、B三色最大,网页代码是#FFFFFF。黑色是三色为0,网页代码是#000000。#XXYYZZ颜色代码可用#XYZ表示,如#135与#113355同色。在CSS中,也可用rgb(127,127,127)代替#7F7F7F(十进制表示)。

例如一种颜色在十进位中红、绿、蓝的比例分别是36、104、160(■),在十六进位制中则分别为24、68、A0,所以十六进位制数字表示方法就为2468A0,如果数字小于16,在十六进位就小于10,前面就要加0,如在十进位分别为0、1、2,在十六进位制数字表示方法就为000102,所以可表示的颜色数总共有2563=1677万7216种。

CSS颜色模块第四版引入了#RRGGBBAA和#RGBA的表示方式。

十进制“函数”表示

CSS2.1开始有rgb(red,green,blue)的十进制颜色代码。

CSS3开始有RGBA和HSLA表示法,可表示透明色:

rgba(255,0,0,0.5):半透明红色。

hsla(120,100%,50%,0.3):半透明(0.3)绿色。

颜色名称

SVG的X11颜色更多信息:颜色列表

HTML4.01版本确定了16种颜色的英语名称与16进制代码:

中文 英文 代码、颜色 中文 英文 代码、颜色 中文 英文 代码、颜色 中文 英文 代码、颜色

黑色black#000000银色silver#c0c0c0栗色maroon#800000红色red#ff0000藏青色navy#000080蓝色blue#0000ff紫色purple#800080品红色fuchsia#ff00ff绿色green#008000草绿色lime#00ff00橄榄绿olive#808000黄色yellow#ffff00蓝绿色teal#008080青色aqua#00ffff灰色gray#808080白色white#ffffff

后来加入如下名称:

CSS颜色模块版本 中文 英文 代码、颜色 注释

2.1橙色orange#ffa5003透明transparent#00000000此处的RGBA十六进制值只适用于CSS颜色模块版本4。4丽碧卡紫rebeccapurple#663399用来悼念埃里克·迈耶的女儿。

除此之外,CSS3(CSS颜色模块版本3)接纳绝大部分X11颜色(或称SVG色)。

X11名称

网景导航者和Internet Explorer又增加了一些颜色名称,由X窗口系统制定。包括常用同义词:aqua(水色、HTML4/CSS 1.0标准名称)和cyan(青色、常用sRGB名称)、fuchsia(品红色、HTML4/CSS 1.0标准名称)和magenta(洋红色、常用sRGB名称)、gray(HTML4/CSS 1.0标准名称)和grey。SVG 1.0将这些颜色定为标准,逐渐获大多数HTML用户接受。

实名 16进制 10进制

红色系Red 纯红FF 00 00255 0 0LightSalmon 浅鲑鱼色FF A0 7A255 160 122Salmon 鲑鱼色FA 80 72250 128 114DarkSalmon 深鲑鱼色E9 96 7A233 150 122LightCoral 淡珊瑚色F0 80 80240 128 128IndianRed 印度红CD 5C 5C205 92 92Crimson 猩红DC 14 3C220 20 60FireBrick 火砖色B2 22 22178 34 34DarkRed 深红8B 00 00139 0 0粉红色系Pink 粉红FF C0 CB255 192 203LightPink 浅粉FF B6 C1255 182 193HotPink 热情粉红FF 69 B4255 105 180DeepPink 深粉FF 14 93255 20 147PaleVioletRed 苍紫罗兰红DB 70 93219 112 147MediumVioletRed 中紫罗兰红C7 15 85199 21 133橙色系Orange 橙色FF A5 00255 165 0DarkOrange 深橙FF 8C 00255 140 0Coral 珊瑚色FF 7F 50255 127 80Tomato 番茄色FF 63 47255 99 71OrangeRed 橙红FF 45 00255 69 0黄色系Yellow 纯黄FF FF 00255 255 0LightYellow 浅黄FF FF E0255 255 224LemonChiffon 柠檬薄纱FF FA CD255 250 205LightGoldenrodYellow 浅秋麒麟黄FA FA D2250 250 210PapayaWhip 番木瓜色FF EF D5255 239 213Moccasin 鹿皮鞋色FF E4 B5255 228 181PeachPuff 桃色FF DA B9255 218 185PaleGoldenrod 灰秋麒麟色EE E8 AA238 232 170Khaki 卡其布色F0 E6 8C240 230 140DarkKhaki 深卡其布色BD B7 6B189 183 107Gold 金色FF D7 00255 215 0紫色系Purple 紫色80 00 80128 0 128Lavender 淡薰衣草紫E6 E6 FA230 230 250Thistle 蓟色D8 BF D8216 191 216Plum 李子色DD A0 DD221 160 221Violet 紫罗兰色EE 82 EE238 130 238Orchid 兰花紫DA 70 D6218 112 214Fuchsia 灯笼海棠色FF 00 FF255 0 255Magenta 洋红FF 00 FF255 0 255MediumOrchid 中兰花紫BA 55 D3186 85 211MediumPurple 中紫93 70 DB147 112 219Amethyst 紫水晶色99 66 CC153 102 204BlueViolet 深紫罗兰蓝8A 2B E2138 43 226DarkViolet 深紫罗兰色94 00 D3148 0 211DarkOrchid 深兰花紫99 32 CC153 50 204DarkMagenta 深洋红8B 00 8B139 0 139MediumSlateBlue 中板岩暗蓝灰7B 68 EE123 104 238SlateBlue 板岩暗蓝灰6A 5A CD106 90 205DarkSlateBlue 深岩暗蓝灰48 3D 8B 72 61 139Indigo 靛青4B 00 82 75 0 130

实名 16进制 10进制

绿色系Green 纯绿00 80 00 0 128 0PaleGreen 苍绿98 FB 98152 251 152LightGreen 淡绿90 EE 90144 238 144YellowGreen 黄绿9A CD 32154 205 50GreenYellow 绿黄AD FF 2F173 255 47Chartreuse 查特酒绿7F FF 00127 255 0LawnGreen 草坪绿7C FC 00124 252 0Lime 青柠色00 FF 00 0 255 0LimeGreen 青柠绿32 CD 32 50 205 50MediumSpringGreen 中春绿00 FA 9A 0 250 154SpringGreen 春绿00 FF 7F 0 255 127MediumAquamarine 中碧绿66 CD AA102 205 170Aquamarine 碧绿7F FF D4127 255 212LightSeaGreen 浅海洋绿20 B2 AA 32 178 170MediumSeaGreen 中海洋绿3C B3 71 60 179 113SeaGreen 海洋绿2E 8B 57 46 139 87DarkSeaGreen 深海洋绿8F BC 8F143 188 143ForestGreen 森林绿22 8B 22 34 139 34DarkGreen 深绿00 64 00 0 100 0OliveDrab 橄榄土褐6B 8E 23107 142 35Olive 橄榄80 80 00128 128 0DarkOliveGreen 深橄榄绿55 6B 2F 85 107 47Teal 深青00 80 80 0 128 128蓝色系Blue 纯蓝00 00 FF 0 0 255LightBlue 淡蓝AD D8 E6173 216 230PowderBlue 粉蓝B0 E0 E6176 224 230PaleTurquoise 苍绿松石色AF EE EE175 238 238MediumTurquoise 中绿松石色48 D1 CC 72 209 204Turquoise 绿松石色40 E0 D0 64 224 208DarkTurquoise 深绿松石色00 CE D1 0 206 209LightCyan 浅青E0 FF FF224 255 255Cyan 青色00 FF FF 0 255 255Aqua 水色00 FF FF 0 255 255DarkCyan 深青00 8B 8B 0 139 139CadetBlue 学员蓝5F 9E A0 95 158 160LightSteelBlue 淡钢蓝B0 C4 DE176 196 222SteelBlue 钢蓝46 82 B4 70 130 180LightSkyBlue 淡天蓝87 CE FA135 206 250SkyBlue 天蓝87 CE EB135 206 235DeepSkyBlue 深天蓝00 BF FF 0 191 255DodgerBlue 道奇蓝1E 90 FF 30 144 255CornflowerBlue 矢车菊蓝64 95 ED100 149 237RoyalBlue 宝蓝41 69 E1 65 105 225MediumBlue 中蓝00 00 CD 0 0 205DarkBlue 深蓝00 00 8B 0 0 139Navy 海军蓝00 00 80 0 0 128MidnightBlue 午夜蓝19 19 70 25 25 112

实名 16进制 10进制

褐色系Brown 纯褐A5 2A 2A165 42 42Cornsilk 玉米丝色FF F8 DC255 248 220BlanchedAlmond 白杏仁色FF EB CD255 235 205Bisque 浓汤色FF E4 C4255 228 196NavajoWhite 纳瓦霍白FF DE AD255 222 173Wheat 小麦色F5 DE B3245 222 179BurlyWood 硬木色DE B8 87222 184 135Tan 棕褐D2 B4 8C210 180 140RosyBrown 玫瑰金BC 8F 8F188 143 143SandyBrown 沙褐F4 A4 60244 164 96Goldenrod 金菊色DA A5 20218 165 32DarkGoldenrod 深金菊色B8 86 0B184 134 11Peru 秘鲁色CD 85 3F205 133 63Chocolate 巧克力色D2 69 1E210 105 30SaddleBrown 鞍褐色8B 45 13139 69 19Sienna 赭黄A0 52 2D160 82 45Maroon 栗色80 00 00128 0 0白色系White 纯白FF FF FF255 255 255Snow 雪白FF FA FA255 250 250Honeydew 哈密瓜色F0 FF F0240 255 240MintCream 薄荷奶油色F5 FF FA245 255 250Azure 天蓝白F0 FF FF240 255 255AliceBlue 爱丽丝蓝F0 F8 FF240 248 255GhostWhite 幽灵白F8 F8 FF248 248 255WhiteSmoke 烟熏白F5 F5 F5245 245 245Seashell 贝壳白FF F5 EE255 245 238Beige 米白F5 F5 DC245 245 220OldLace 旧蕾丝白FD F5 E6253 245 230FloralWhite 花白FF FA F0255 250 240Ivory 象牙白FF FF F0255 255 240AntiqueWhite 古董白FA EB D7250 235 215Linen 亚麻白FA F0 E6250 240 230LavenderBlush 薰衣草紫红FF F0 F5255 240 245MistyRose 雾玫瑰色FF E4 E1255 228 225灰色系与黑色系Gray 纯灰80 80 80128 128 128Gainsboro 庚斯博罗灰DC DC DC220 220 220LightGray 淡灰D3 D3 D3211 211 211Silver 纯银C0 C0 C0192 192 192DarkGray 深灰A9 A9 A9169 169 169DimGray 昏灰69 69 69105 105 105LightSlateGray 淡岩灰77 88 99119 136 153SlateGray 岩灰70 80 90112 128 144DarkSlateGray 深岩灰2F 4F 4F 47 79 79Black 纯黑00 00 00 0 0 0

网页安全颜色

此条目可参照英语百科相应条目来扩充(2015年9月5日)
若您熟悉来源语言和主题,请协助参考外语百科扩充条目。请勿直接提交机械翻译,也不要翻译不可靠、低品质内容。依版权协议,译文需在编辑摘要注明来源,或于讨论页顶部标记{{Translated page}}标签。

开发网页安全颜色(Web-safe colors)调色板时,大部分显示方式是8位元,只能显示256种色。要显示某种硬件预先定义的颜色以外的颜色,要么使用最接近的颜色替代,要么多用一些时间,抖动混合显示颜色。

David Lehn和Hadley Stern发现在更换16位元显示后,只有22种颜色是“真正安全”(really safe),更换显示后不会出现不协调畸变。

下面列出所有网页安全颜色,粗体下划线表示的为“真正安全”颜色:

网页安全颜色

000300600900C00F00003303603903C03F03006306606906C06F06009309609909C09F0900C30C60C90CC0CF0C00F30F60F90FC0FF0F030330630930C30F30033333633933C33F33036336636936C36F36039339639939C39F3903C33C63C93CC3CF3C03F33F63F93FC3FF3F060360660960C60F60063363663963C63F63066366666966C66F66069369669969C69F6906C36C66C96CC6CF6C06F36F66F96FC6FF6F090390690990C90F90093393693993C93F93096396696996C96F96099399699999C99F9909C39C69C99CC9CF9C09F39F69F99FC9FF9F0C03C06C09C0CC0FC00C33C36C39C3CC3FC30C63C66C69C6CC6FC60C93C96C99C9CC9FC90CC3CC6CC9CCCCCFCC0CF3CF6CF9CFCCFFCF0F03F06F09F0CF0FF00F33F36F39F3CF3FF30F63F66F69F6CF6FF60F93F96F99F9CF9FF90FC3FC6FC9FCCFCFFC0FF3FF6FF9FFCFFFFF

网页最安全颜色

真正安全用于网页的22种颜色 0 3 6 9 C F 00

#000(Black)#F00(Red)

03

#003#F03

0F

#00F(Blue)#F0F(Fuchsia)

F0

#0F0(Lime)#6F0#FF0(Yellow)

F3

#3F3#6F3#FF3

F6

#0F6#3F6#CF6#FF6

FC

#0FC#3FC

FF

#0FF(Aqua)#3FF#6FF#FFF(White)

8组括弧内的是“HTML基本16色(日语:カラーチャート#基本16色)”的名。

基本16色

基本16色标准16色(Basic 16 Colors)是指在HTML直接指定其英语名就可以显示出来的16色。

上方:指定的颜色名RGB值(16进制)

下方:指定字符的显示效果

名称 英语 颜色 色光 色料 色相 十六进制码 MS-DOS R G B C M Y K 角度 饱和 明度

红色Red25500010010000°100%100%#FF000012黄色Yellow255255000100060°100%100%#FFFF0014草绿色Lime0255010001000120°100%100%#00FF0010青色Aqua0255255100000180°100%100%#00FFFF11蓝色Blue0025510010000240°100%100%#0000FF9品红色Fuchsia2550255010000300°100%100%#FF00FF13栗色Maroon128000100100500°100%50%#8000004橄榄绿Olive1281280001005060°100%50%#8080006绿色Green01280100010050120°100%50%#0080002蓝绿色Teal01281281000050180°100%50%#0080803藏青色Navy00128100100050240°100%50%#0000801紫色Purple12801280100050300°100%50%#8000805白色White25525525500000°0%100%#FFFFFF15银色Silver192192192000250°0%75%#C0C0C07灰色Gray128128128000500°0%50%#8080808黑色Black0000001000°0%0%#0000000

渐变色

CSS3引入了渐变色,分为线性渐变(如linear-gradient(#D1EEFC, #81F3FD);)和圆心渐变(如radial-gradient(#FEFD58, #71FCA6, #52EDC7);)两种。线性渐变可设定方向,圆心渐变可设定形状。

Published by

风君子

独自遨游何稽首 揭天掀地慰生平