颜色代码：网页颜色代码大全及色彩搭配教程

 华艺时空注：

       鉴于朋友们（包括我自己）在设计网页、取用颜色时到处东翻西找的不便，经过认真学习领悟，觉得有必要把比较全面的颜色代码表做到博客中来，同时更觉得网页颜色搭配常规性知识与技能十分重要。因此，我汇集了网上众贤的高见，做成了这期专题。希望能给大家的日常使用带来方便，更希望朋友们天天进步，更上一层楼！

       特请朋友们在转载时注明：本专题来自于“华艺时空积学网”，整理改编：华艺时空。以示对本人劳动成果的尊重（做这一个专题是需要时间和精力的。老婆都打俺了，呵呵。。。。）

 

颜色代码表（史上最全 一览无余）

 #000000

 #000033

 #000066

 #000099

 #0000CC

 #0000FF

 #003300

 #003333

 #003366

 #003399

 #0033CC

 #0033FF

 #006600

 #006633

 #006666

 #006699

 #0066CC

 #0066FF

 #009900

 #009933

 #009966

 #009999

 #0099CC

 #0099FF

 #00CC00

 #00CC33

 #00CC66

 #00CC99

 #00CCCC

 #00CCFF

 #00FF00

 #00FF33

 #00FF66

 #00FF99

 #00FFCC

 #00FFFF

 #330000

 #330033

 #330066

 #330099

 #3300CC

 #3300FF

 #333300

 #333333

 #333366

 #333399

 #3333CC

 #3333FF

 #336600

 #336633

 #336666

 #336699

 #3366CC

 #3366FF

 #339900

 #339933

 #339966

 #339999

 #3399CC

 #3399FF

 #33CC00

 #33CC33

 #33CC66

 #33CC99

 #33CCCC

 #33CCFF

 #33FF00

 #33FF33

 #33FF66

 #33FF99

 #33FFCC

 #33FFFF

 #660000

 #660033

 #660066

 #660099

 #6600CC

 #6600FF

 #663300

 #663333

 #663366

 #663399

 #6633CC

 #6633FF

 #666600

 #666633

 #666666

 #666699

 #6666CC

 #6666FF

 #669900

 #669933

 #669966

 #669999

 #6699CC

 #6699FF

 #66CC00

 #66CC33

 #66CC66

 #66CC99

 #66CCCC

 #66CCFF

 #66FF00

 #66FF33

 #66FF66

 #66FF99

 #66FFCC

 #66FFFF

 #990000

 #990033

 #990066

 #990099

 #9900CC

 #9900FF

 #993300

 #993333

 #993366

 #993399

 #9933CC

 #9933FF

 #996600

 #996633

 #996666

 #996699

 #9966CC

 #9966FF

 #999900

 #999933

 #999966

 #999999

 #9999CC

 #9999FF

 #99CC00

 #99CC33

 #99CC66

 #99CC99

 #99CCCC

 #99CCFF

 #99FF00

 #99FF33

 #99FF66

 #99FF99

 #99FFCC

 #99FFFF

 #CC0000

 #CC0033

 #CC0066

 #CC0099

 #CC00CC

 #CC00FF

 #CC3300

 #CC3333

 #CC3366

 #CC3399

 #CC33CC

 #CC33FF

 #CC6600

 #CC6633

 #CC6666

 #CC6699

 #CC66CC

 #CC66FF

 #CC9900

 #CC9933

 #CC9966

 #CC9999

 #CC99CC

 #CC99FF

 #CCCC00

 #CCCC33

 #CCCC66

 #CCCC99

 #CCCCCC

 #CCCCFF

 #CCFF00

 #CCFF33

 #CCFF66

 #CCFF99

 #CCFFCC

 #CCFFFF

 #FF0000

 #FF0033

 #FF0066

 #FF0099

 #FF00CC

 #FF00FF

 #FF3300

 #FF3333

 #FF3366

 #FF3399

 #FF33CC

 #FF33FF

 #FF6600

 #FF6633

 #FF6666

 #FF6699

 #FF66CC

 #FF66FF

 #FF9900

 #FF9933

 #FF9966

 #FF9999

 #FF99CC

 #FF99FF

 #FFCC00

 #FFCC33

 #FFCC66

 #FFCC99

 #FFCCCC

 #FFCCFF

 #FFFF00

 #FFFF33

 #FFFF66

 #FFFF99

 #FFFFCC

 #FFFFFF

 #FFFFF0

 #FFFFE0

 #FFFAFA

 #FFFAF0

 #FFFACD

 #FFF8DC

 #FFF68F

 #FFF5EE

 #FFF0F5

 #FFEFDB

 #FFEFD5

 #FFEC8B

 #FFEBCD

 #FFE7BA

 #FFE4E1

 #FFE4C4

 #FFE4B5

 #FFE1FF

 #FFDEAD

 #FFDAB9

 #FFD700

 #FFD39B

 #FFC1C1

 #FFC125

 #FFC0CB

 #FFBBFF

 #FFB90F

 #FFB6C1

 #FFB5C5

 #FFAEB9

 #FFA54F

 #FFA500

 #FFA07A

 #FF8C69

 #FF8C00

 #FF83FA

 #FF82AB

 #FF8247

 #FF7F50

 #FF7F24

 #FF7F00

 #FF7256

 #FF6EB4

 #FF6A6A

 #FF69B4

 #FF6347

 #FF4500

 #FF4040

 #FF3E96

 #FF34B3

 #FF3030

 #FF1493

 #FDF5E6

 #FAFAD2

 #FAF0E6

 #FAEBD7

 #FA8072

 #F8F8FF

 #F7F7F7

 #F5FFFA

 #F5F5DC

 #F5DEB3

 #F4A460

 #F0FFFF

 #F0FFF0

 #F0F8FF

 #F0F0F0

 #F0E68C

 #F08080

 #EEEEE0

 #EEEED1

 #EEEE00

 #EEE9E9

 #EEE9BF

 #EEE8CD

 #EEE8AA

 #EEE685

 #EEE5DE

 #EEE0E5

 #EEDFCC

 #EEDC82

 #EED8AE

 #EED5D2

 #EED5B7

 #EED2EE

 #EECFA1

 #EECBAD

 #EEC900

 #EEC591

 #EEB4B4

 #EEB422

 #EEAEEE

 #EEAD0E

 #EEA9B8

 #EEA2AD

 #EE9A49

 #EE9A00

 #EE9572

 #EE82EE

 #EE8262

 #EE7AE9

 #EE799F

 #EE7942

 #EE7621

 #EE7600

 #EE6AA7

 #EE6A50

 #EE6363

 #EE5C42

 #EE4000

 #EE3B3B

 #EE3A8C

 #EE30A7

 #EE2C2C

 #EE1289

 #EE00EE

 #EE0000

 #EDEDED

 #EBEBEB

 #EAEAEA

 #E9967A

 #E8E8E8

 #E6E6FA

 #E5E5E5

 #E3E3E3

 #E0FFFF

 #E0EEEE

 #E0EEE0

 #E0E0E0

 #E066FF

 #DEDEDE

 #DEB887

 #DDA0DD

 #DCDCDC

 #DC143C

 #DBDBDB

 #DB7093

 #DAA520

 #DA70D6

 #D9D9D9

 #D8BFD8

 #D6D6D6

 #D4D4D4

 #D3D3D3

 #D2B48C

 #D2691E

 #D1EEEE

 #D1D1D1

 #D15FEE

 #D02090

 #CFCFCF

 #CDCDC1

 #CDCDB4

 #CDCD00

 #CDC9C9

 #CDC9A5

 #CDC8B1

 #CDC673

 #CDC5BF

 #CDC1C5

 #CDC0B0

 #CDBE70

 #CDBA96

 #CDB7B5

 #CDB79E

 #CDB5CD

 #CDB38B

 #CDAF95

 #CDAD00

 #CDAA7D

 #CD9B9B

 #CD9B1D

 #CD96CD

 #CD950C

 #CD919E

 #CD8C95

 #CD853F

 #CD8500

 #CD8162

 #CD7054

 #CD69C9

 #CD6889

 #CD6839

 #CD661D

 #CD6600

 #CD6090

 #CD5C5C

 #CD5B45

 #CD5555

 #CD4F39

 #CD3700

 #CD3333

 #CD3278

 #CD2990

 #CD2626

 #CD1076

 #CD00CD

 #CD0000

 #CAFF70

 #CAE1FF

 #C9C9C9

 #C7C7C7

 #C71585

 #C6E2FF

 #C67171

 #C5C1AA

 #C4C4C4

 #C2C2C2

 #C1FFC1

 #C1CDCD

 #C1CDC1

 #C1C1C1

 #C0FF3E

 #BFEFFF

 #BFBFBF

 #BF3EFF

 #BEBEBE

 #BDBDBD

 #BDB76B

 #BCEE68

 #BCD2EE

 #BC8F8F

 #BBFFFF

 #BABABA

 #BA55D3

 #B9D3EE

 #B8B8B8

 #B8860B

 #B7B7B7

 #B5B5B5

 #B4EEB4

 #B4CDCD

 #B452CD

 #B3EE3A

 #B3B3B3

 #B2DFEE

 #B23AEE

 #B22222

 #B0E2FF

 #B0E0E6

 #B0C4DE

 #B0B0B0

 #B03060

 #AEEEEE

 #ADFF2F

 #ADD8E6

 #A6A6A6

 #A52A2A

 #A4D3EE

 #A3A3A3

 #A2CD5A

 #A2B5CD

 #A1A1A1

 #A0522D

 #A020F0

 #AB82FF

 #9FB6CD

 #9F79EE

 #9E9E9E

 #9BCD9B

 #9B30FF

 #9AFF9A

 #9ACD32

 #9AC0CD

 #9A32CD

 #9932CC

 #98FB98

 #98F5FF

 #97FFFF

 #96CDCD

 #969696

 #949494

 #9400D3

 #9370DB

 #919191

 #912CEE

 #90EE90

 #8FBC8F

 #8F8F8F

 #8EE5EE

 #8E8E8E

 #8E8E38

 #8E388E

 #8DEEEE

 #8DB6CD

 #8C8C8C

 #8B8B83

 #8B8B7A

 #8B8B00

 #8B8989

 #8B8970

 #8B8878

 #8B8682

 #8B864E

 #8B8386

 #8B8378

 #8B814C

 #8B7E66

 #8B7D7B

 #8B7D6B

 #8B7B8B

 #8B795E

 #8B7765

 #8B7500

 #8B7355

 #8B6969

 #8B6914

 #8B668B

 #8B6508

 #8B636C

 #8B5F65

 #8B5A2B

 #8B5A00

 #8B5742

 #8B4C39

 #8B4789

 #8B475D

 #8B4726

 #8B4513

 #8B4500

 #8B3E2F

 #8B3A62

 #8B3A3A

 #8B3626

 #8B2500

 #8B2323

 #8B2252

 #8B1C62

 #8B1A1A

 #8B0A50

 #8B008B

 #8B0000

 #8A8A8A

 #8A2BE2

 #8968CD

 #87CEFF

 #87CEFA

 #87CEEB

 #878787

 #858585

 #848484

 #8470FF

 #838B8B

 #838B83

 #836FFF

 #828282

 #7FFFD4

 #7FFF00

 #7F7F7F

 #7EC0EE

 #7D9EC0

 #7D7D7D

 #7D26CD

 #7CFC00

 #7CCD7C

 #7B68EE

 #7AC5CD

 #7A8B8B

 #7A7A7A

 #7A67EE

 #7A378B

 #79CDCD

 #787878

 #778899

 #76EEC6

 #76EE00

 #757575

 #737373

 #71C671

 #7171C6

 #708090

 #707070

 #6E8B3D

 #6E7B8B

 #6E6E6E

 #6CA6CD

 #6C7B8B

 #6B8E23

 #6B6B6B

 #6A5ACD

 #698B69

 #698B22

 #696969

 #6959CD

 #68838B

 #68228B

 #66CDAA

 #66CD00

 #668B8B

 #6495ED

 #63B8FF

 #636363

 #616161

 #607B8B

 #5F9EA0

 #5E5E5E

 #5D478B

 #5CACEE

 #5C5C5C

 #5B5B5B

 #595959

 #575757

 #556B2F

 #555555

 #551A8B

 #54FF9F

 #548B54

 #545454

 #53868B

 #528B8B

 #525252

 #515151

 #4F94CD

 #4F4F4F

 #4EEE94

 #4D4D4D

 #4B0082

 #4A708B

 #4A4A4A

 #48D1CC

 #4876FF

 #483D8B

 #474747

 #473C8B

 #4682B4

 #458B74

 #458B00

 #454545

 #43CD80

 #436EEE

 #424242

 #4169E1

 #40E0D0

 #404040

 #3D3D3D

 #3CB371

 #3B3B3B

 #3A5FCD

 #388E8E

 #383838

 #36648B

 #363636

 #32CD32

 #303030

 #2F4F4F

 #2E8B57

 #2E2E2E

 #2B2B2B

 #292929

 #282828

 #27408B

 #262626

 #242424

 #228B22

 #218868

 #212121

 #20B2AA

 #1F1F1F

 #1E90FF

 #1E1E1E

 #1C86EE

 #1C1C1C

 #1A1A1A

 #191970

 #1874CD

 #171717

 #141414

 #121212

 #104E8B

 #0F0F0F

 #0D0D0D

 #0A0A0A

 #080808

 #050505

 #030303

 #00FF7F

 #00FA9A

 #00F5FF

 #00EEEE

 #00EE76

 #00EE00

 #00E5EE

 #00CED1

 #00CDCD

 #00CD66

 #00CD00

 #00C5CD

 #00BFFF

 #00B2EE

 #009ACD

 #008B8B

 #008B45

 #008B00

 #00868B

 #00688B

 #006400

 #0000EE

 #0000CD

 #0000AA

 #00008B

 #000080

   

 #990033

 #CC6699

 #FF6699

 #FF3366

 #993366

 #CC0066

 #CC0033

 #FF0066

 #FF0033

 #CC3399

 #FF3399

 #FF9999

 #FF99CC

 #FF0099

 #CC3366

 #FF66CC

 #FF33CC

 #FFCCFF

 #FF99FF

 #FF00CC

 #FF66FF

 #CC33CC

 #CC00FF

 #FF33FF

 #CC99FF

 #9900CC

 #FF00FF

 #CC66FF

 #990099

 #CC0099

 #CC33FF

 #CC99CC

 #990066

 #993399

 #CC66CC

 #CC00CC

 #663366

 

 #660099

 #666FF

 #000CC

 #9933CC

 #666699

 #660066

 #333366

 #0066CC

 #9900FF

 #333399

 #99CCFF

 #9933FF

 #330099

 #6699FF

 #9966CC

 #3300CC

 #003366

 #330033

 #3300FF

 #6699CC

 #663399

 #3333FF

 #006699

 #6633CC

 #3333CC

 #3399CC

 #6600CC

 #0066FF

 #0099CC

 #9966FF

 #0033FF

 #66CCFF

 #330066

 #3366FF

 #3399FF

 #6600FF

 #3366CC

 #003399

 #6633FF

 #000066

 #0099FF

 #CCCCFF

 #000033

 #33CCFF

 #9999FF

 #0000FF

 #00CCFF

 #9999CC

 #000099

 #6666CC

 #0033CC

 

 #FFFFCC

 #FFCC00

 #CC99090

 #663300

 #FF6600

 #663333

 #CC6666

 #FF6666

 #FF0000

 #FFFF99

 #FFCC66

 #FF9900

 #FF9966

 #CC3300

 #996666

 #CC6600

 #FF6633

 #996633

 #CC9999

 #FF3333

 #990000

 #CC9966

 #FFFF33

 #CC9933

 #993300

 #FF9933

 #330000

 #993333

 #CC3333

 #CC0000

 #FFCC99

 #FFFF00

 #996600

 #CC6633

 #99FFFF

 #33CCCC

 #00CC99

 #99FF99

 #009966

 #33FF33

 #33FF00

 #99CC33

 #CCC33

 #009966

 #66CCCC

 #66FFCC

 #66FF66

 #009933

 #00CC33

 #66FF00

 #336600

 #33300

 #33FFFF

 #339999

 #99FFCC

 #339933

 #33FF66

 #33CC33

 #99FF00

 #669900

 #666600

 #00FFFF

 #336666

 #00FF99

 #99CC99

 #00FF66

 #66FF33

 #66CC00

 #99CC00

 #999933

 #00CCCC

 #006666

 #339966

 #66FF99

 #CCFFCC

 #00FF00

 #00CC00

 #CCFF66

 #CCCC66

 #009999

 #003333

 #006633

 #33FF99

 #CCFF99

 #66CC33

 #33CC00

 #CCFF33

 #666633

 #669999

 #00FFCC

 #336633

 #33CC66

 #99FF66

 #006600

 #339900

 #CCFF00

 #999966

 #99CCCC

 #33FFCC

 #669966

 #00CC66

 #99FF33

 #003300

 #99CC66

 #999900

 #CCCC99

 #CCFFFF

 #33CC99

 #66CC66

 #66CC99

 #00FF33

 #009900

 #669900

 #669933

 #CCCC00

 

 

 

 

 #FFFFF

 #CCCCCC

 #999999

 #666666

 #333333

 #000000

 

英文颜色代码表（附下）

 red

 green

 blue

 magenta

 yellow

 chocolate

 black

 aquamarine

 lime

 fuchsia

 brass

 azure

 brown

 bronze

 deeppink

 aliceblue

 gray

 copper

 coral

 feldspar

 orange

 orchid

 pink

 plum

 quartz

 purple

 antiquewithe

 blanchedalmond

 blueviolet

 beige

 burlywood

 bisque

 cadetblue

 saddlebrown

 royalblue

 rosybrown

 orengered

 olivedrab

 powderblue

 peachpuff

 papayawhip

 paleturquoise

 palevioletred

 palegreen

 navyblue

 navajowhite

 palegodenrod

 violetred

 yellowgreen

 tomato

 turquoise

 thistle

 springgreen

 steelblue

 salmon

 scarlet

 sienna

 silver

 tan

 violet

 snow

 chartreuse

 firebrick

 gold

 khaki

 mediumslateblue

 mediumvioletred

 oldlace

 maroon

 goldenrod

 wheat

 whitesmoke

 moccasin

 mistyrose

 mintcream

 midnightblue

 dimgray

 darksalmon

 slategray

 skyblue

 seashell

 seagreen

 sandybrown

 mediumturquoise

 navy

 mediumspringgreen

 mediumseagreen

 mediumpurpul

 peru

 mediumorchid

 mediumblue

 mediumaquamarine

 limegreen

 lightyellow

 lightsteelblue

 lavender

 lavenderblush

 lemonchiffon

 lightyellow

 lightsteelblue

 lightslateblue

 lightslategray

 lightskyblue

 lightseagreen

 lightsalmon

 lightpink

 lightgray

 lightgreen

 lightgodenrodyellow

 indianred

 lightblue

 lightcoral

 lightcyan

 lightgodenrod

 hotpink

 greenyellow

 lawngreen

 deepskyblue

 honeydew

 forestgreen

 gostwhite

 gainsboro

 dodgerblue

 darkturquoise

 darkslateblue

 darkslategray

 darkseagreen

 darkred

 darkorchid

 darkorenge

 darkslateblue

 darkviolet

 floralwhite

 cyan

 cornsilk

 darkolivegreen

 darkgoldenrod

 darkcyan

 darkgreen

 darkhaki

 ivory

 darkmagenta

 darkgray

 cornfloewrblue

 darkviolet

 

网页色彩搭配技巧教程（改编整理）

       通常，草莓视频在线观看APP在打开一个网站时，第一印象并不是网站丰富的内容，也不是网站合理的版面布局，而是网站的色彩搭配得如何。网站色彩的搭配对人的视觉效果非常具有冲击力。大家知道：网页设计属于平面效果设计之一，排除立体图形、动画效果等，在平面视觉上色彩的冲击力是最强的。因此，一个网站设计得成败与否，一定程度上取决于设计者对色彩的搭配运用。

       一、色彩基础知识        学过美术的人都知道：草莓视频在线观看APP平时所看到的白色光，是由红、橙、黄、绿、青、蓝、紫七色组成的，而各个颜色之间是自然过渡的。按照美术学科的色彩知识，草莓视频在线观看APP把红、黄、蓝三种颜色叫做三原色，三原色是组成万千色彩的最基本的颜色。三原色通过不同比例进行混合就可以得到各种颜色（就如草莓视频在线观看APP上面所列出的千变万化的颜色图谱）。色彩还有冷暖色之分，冷色(如蓝色)给人的感觉是安静、冰冷；而暖色(如红色)给人的感觉是热烈、火热。冷暖色的巧妙运用可以让网站的色彩搭配产生意想不到的效果。         正因为色彩能影响到人的心理和情绪，因而草莓视频在线观看APP可以在设计网页时形成自己独特的色彩感受，为浏览者留下深刻的印象。一般情况下，各种色彩给人的感觉是：         红色：代表热情、活泼、热闹、温暖、幸福、吉祥 ；        橙色：代表光明、华丽、兴奋、甜蜜、快乐 ；        黄色：代表明朗、愉快、高贵、希望；         绿色：代表新鲜、平静、和平、柔和、安逸、青春 ；        蓝色：代表深远、永恒、沉静、理智、诚实、寒冷；         紫色：代表优雅、高贵、魅力、自傲；         白色：代表纯洁、纯真、朴素、神圣、明快；         灰色：代表忧郁、消极、谦虚、平凡、沉默、中庸、寂寞；         黑色：代表崇高、坚实、严肃、刚健、粗莽； 

       二、色彩搭配原则

       色彩搭配既是一项技术性工作，同时它也是一项艺术性很强的工作。因此，设计者在设计网页时除了要考虑网站本身的特点外，还要遵循一定的艺术规律，设计出色彩鲜明，性格独特的网站。

       1、特色鲜明

       一个网站的用色必须要有自己独特的风格，只有个性鲜明，才能给浏览者留下深刻的印象。       

       2、搭配合理

       网页设计虽然属于平面设计的范畴，但它又与其它平面设计有所不同。它必须在遵从艺术规律的同时，还要考虑到人的生理特点。因此，色彩搭配一定要合理，要给人一种和谐、愉快的感觉，避免采用纯度很高的单一色彩，这样容易造成视觉疲劳。

       3、讲究艺术性

       网站设计也是一种艺术创新。在遵循艺术规律的同时，还要考虑到网站自身的特点，要按照内容决定形式的原则，大胆进行艺术创新，设计出既符合网站要求，又有一定艺术特色的网站。

       三、色彩搭配应注意的问题

       1、使用单色 

        尽管网站设计要避免采用单一色彩，以免产生单调的感觉，但通过调整色彩的饱和度和透明度也可以产生变化，使网站避免单调。

       2、使用邻近色

       所谓邻近色，就是在色带上相邻近的颜色，例如绿色和蓝色，红色和黄色就互为邻近色。采用邻近色设计网页，可以使网页避免色彩杂乱，以达到页面艺术的和谐与统一。

       3、使用对比色

       对比色可以突出重点，产生了强烈的视觉效果。通过合理使用对比色，能够使网站特色鲜明、重点突出。在设计时一般以一种颜色为主色调，对比色作为点缀，以起到画龙点睛的作用。

       4、黑色的使用

       黑色是一种特殊的颜色，如果使用恰当，设计合理，往往产生很强烈的艺术效果。黑色一般用来作背景色，与其它纯度色彩搭配使用。

       5、背景色的使用

       背景色一般采用素雅清淡的色彩，避免采用花纹复杂的图片和纯度很高的色彩作为背景色，同时背景色要与文字的色彩对比搭配好，使之与文字色彩对的比强烈一些。

       6、色彩的数量

       一般初学者在设计网页时往往使用多种颜色，使网页变得很“花哨”，缺乏内在美感和和谐统一。实质上，网站的用色不是越多越好，一般应控制在三种色彩以内，通过调整色彩的各种属性来使之产生变化。

对于做网页的初学者来说，他们可能更愿意使用一些漂亮图片作为自己网页的背景。但你浏览一下那些大型商业网站，就会发现：他们