颜色搭配表.doc_第1页
颜色搭配表.doc_第2页
颜色搭配表.doc_第3页
颜色搭配表.doc_第4页
颜色搭配表.doc_第5页
已阅读5页,还剩23页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

颜色搭配表+按色相的搭配分类本节将网页设计中常见的色彩搭配按照色相的顺序归类。每类都以该色相为主,配以其他色相或者同色相的,应用对比和调和的方法,并按照从轻快到浓烈的顺序排序。红色#ffffcc#ccffff#ffcccc#99cccc#ffcc99#ffcccc#ff9999#996699#ffcccc#cc9999#ffffcc#cccc99#ffcccc#ffff99#ccccff#0099cc#cccccc#ff6666#ff9966#ff6666#ffcccc#cc9966#666666#cc9999#ff6666#ffff66#99cc66#cc3333#cccccc#003366#993333#cccc00#663366#cccc99#666666#cc9999#ff6666#ffff00#0066cc#cc0033#333333#cccc00#336633#990033#ffcc99#993333#cc9966#003300#ff0033#333399#cccc00#cc0033#000000#003399#000000#99cc00#cc0033#999933#993333#333300橙色#ffcc99#ffff99#99cc99#ffcc99#ccff99#cccccc#ffcc99#ffffcc#99ccff#ff9966#ffffcc#99cc99#ff9900#ffffcc#336699#cccc33#ffff99#cc9933#996600#ffcc33#ffffcc#ffffcc#cc9933#336666#ff9900#ffff00#0099cc#99cc33#ff9900#ffcc00#ff9933#99cc33#cc6699#ff9933#ffff00#3366cc#ff9933#ffffcc#009966#ff6600#ffff66#009966#990033#ccff66#ff9900#ff9966#996600#cccc00#cc6600#999999#cccc33#cc6600#cccc33#336699#000000#ff9933#999966#663300#ff9933#ffff66黄色#ffffcc#ccffff#ffcccc#ffff00#ffffff#cccc00#99ccff#ffcc33#ffffcc#ffff33#99ccff#cccccc#ffff00#ffffff#9933ff#99ccff#ffcc33#ffff33#ffcc00#66cc00#ffff99#ff9900#ffff00#0099cc#ffcc00#0000cc#ffff99#cc9999#ffffcc#6666cc#999933#ffffcc#cc99cc#cccc00#666600#ffff66#ff9966#ffffcc#99cc99#ffcc33#ffffcc#999966#ffcc99#ff6666#ffff66#ffcc99#999966#ffff00#ffff99#99cc99#666600#999966#ffff99#333333#006633#333300#cccc99#006633#663300#cccc66黄绿色#33cc33#6666cc#ffffff#cccc33#ffffff#ccffcc#ffcc99#ccff99#cccccc#cccc00#999966#ffffcc#cccc33#ffffff#336699#cccc33#999999#ccffff#00cc00#0066cc#99cccc#99cc33#ff9900#ffcc00#99cc33#ccccff#663300#cccc33#993399#000000#cc6600#999999#cccc33#cc9933#ffff99#99cc99#669933#cccc33#663300#99cc33#cccccc#000000#cc6600#cccc33#336699#666600#cccc66#ccffcc#333366#99cc33#336699#666666#99cc33#003366#003333#99cc33#999999#996633#ffff99#99cc66绿色#009966#ffffff#ffff00#339933#ffffff#9933cc#339933#ffffff#000000#339933#99cc00#ffffcc#ffffcc#cccc66#336666#99cc33#ffff66#336600#339933#cc9900#666666#339966#cccccc#003366#669933#cccccc#000000#339933#cccccc#6699cc#006633#cccc33#cc9933#339933#666633#cccc66#339933#ffcc33#336699#006633#669933#99cc99#336666#996633#cccc33#003300#669933#cccc99#006633#990033#ff9900#006633#333300#cccc99#006633#663300#cccc66#993333#cc9966#003300青绿色#ccff99#ffffff#66cccc#339999#ffffff#99ccff#66cc99#ffffff#666699#009999#66cccc#ccffff#66cccc#ccff66#ff99cc#339999#ffff00#336699#cc9933#339999#ffcc33#ffcc00#009999#cc3333#669999#cccccc#cc99cc#339999#cccccc#000000#339999#666699#cccccc#003333#99cc99#ffffcc#669999#ccffcc#996699#996699#cccc99#669999#999966#cccc99#339999#336666#669999#cccc99#999999#003366#669999#663333#339999#cccc66#333333#339999#ccffcc#336666#3399cc#666666蓝色#ffffcc#ccffff#ffcccc#99cccc#ffffff#3399cc#ccffcc#99cccc#ffffcc#ccccff#ffffff#99ccff#ffcc99#ffffcc#99ccff#336699#ffffff#99cccc#99cccc#ffffff#ccff99#ccccff#ffffcc#ccffff#99cccc#ffffff#336699#99ccff#ccffff#6699cc#99cc33#ffffff#3399cc#0099cc#ffffcc#666699#cccccc#003366#99ccff#0099cc#ffffff#666666#cccccc#6699cc#666666#336699#cccc99#003366#3399cc#003366#cccccc#6699cc#006699#000000#003366#cccccc#006699#999933#336699#333333蓝紫色#ccffff#ffffff#ccccff#cccccc#ffffff#666699#99ccff#ffffff#333399#6666cc#ffffff#ff9999#9999ff#ffcc33#ffffcc#0099cc#ffffcc#666699#0000ff#6699ff#ccffff#6666ff#66ccff#ccff66#669999#ffffcc#6666cc#9999cc#ff9999#666699#003399#ffcccc#6699cc#cc6666#333399#cccc00#000066#6666ff#cccccc#003399#ccff99#333333#333366#cc0033#cccccc#336699#cccc66#333300#003399#ffff99#000000#990066#cccc33#003399#cc3333#000000#003399#333366#999966#333333紫色#ffffcc#ffff99#ccccff#9999cc#99cc99#ffffff#ffcccc#ccccff#cccc99#9999cc#ffffcc#ffcccc#ffcccc#ff99cc#ccccff#660066#ffffff#663333#cccc99#333333#9966cc#cccc00#ff9966#663399#996699#ffcccc#cc99cc#996666#cc99cc#ffcccc#ffcc99#ff9933#663366#333399#ccccff#cc99cc#663366#cccccc#cc99cc#996699#9999cc#ccccff#cc9966#999999#663366#330033#666666#669999#cccccc#999999#663366#ff33cc#cccc99#663366#663366#999999#ccccff#999966#993333#330033紫红色#ffcccc#ffffff#99cc00#ff99cc#ffffff#993366#66cc99#ffffff#cc6699#cc9999#ffcccc#cc99cc#ffcccc#ffff99#ccccff#ffff99#993399#ff99cc#66cccc#ccff66#ff99cc#ff99cc#003399#cccc00#ffcccc#ff99cc#ccccff#ff9999#ffcccc#ff99cc#669966#cc6699#ffccff#cccccc#cc99cc#cc3399#cc3399#ffcc99#ff6666#ff3399#cccc99#663366#663366#ffffcc#ffcccc#663366#cccccc#cc99cc#990066#ffcc00#cc0033#990066#cccccc#006699#999900#990033#000000#990066#000000#009966按印象的搭配分类色彩搭配看似复杂,但并不神秘。既然每种色彩在印象空间中都有自己的位置,那么色彩搭配得到的印象可以用加减法来近似估算。如果每种色彩都是高亮度的,那么它们的叠加,自然会是柔和、明亮的;如果每种色彩都是浓烈的,那么它们叠加,就会是浓烈的。当然在实际设计过程中,设计师还要考虑到乘除法,比如同样亮度和对比度的色彩,在色环上的角度不同,搭配起来就会得到千变万化的感觉。因此本书除了要列举出按色相的搭配,也要将印象作为重点的搭配分类列举出来,以供读者参考。柔和、明亮、温柔亮度高的色彩搭配在一起就会得到柔和、明亮、温和的感觉。为了避免刺眼,设计师一般会用低亮度的前景色调和,同时色彩在色环之间的距离也有助于避免沉闷。#ffffcc#ccffff#ffcccc#ffcccc#ffff99#ccccff#ff9966#ff6666#ffcccc#ffcc99#ccff99#cccccc#ffcccc#ccccff#ccffcc#ccffff#cccccc#ccff99#ffcccc#ffffff#99cc99#99cccc#ffcc99#ffcccc#ccccff#ffcccc#ccffff#ffcc99#ffffcc#99cccc柔和、洁净、爽朗对于柔和、清洁、爽朗的印象,色环中蓝到绿相邻的颜色应该是最适合的。并且亮度偏高。可以看到,几乎每个组合都有白色参与。当然在实际设计时,可以用蓝绿相反色相的高亮度有彩色代替白色。#ccff99#ffffff#99ccff#99cccc#ffffff#ccff99#ccffcc#ffffff#66cccc#ccccff#ffffff#99cccc#ccffcc#99cccc#ffffcc#ccffff#ffffff#ccccff#ccffff#ffffff#99ccff#66ccff#ffffff#ccffff#6699cc#ffffff#99ccff#ccccff#ffffff#99ccff可爱、快乐、有趣可爱、快乐、有趣印象中的色彩搭配特点是,色相分布均匀,冷暖搭配,饱和度高,色彩分辨度高。#66cccc#ccff66#ff99cc#ff9999#ffffff#ffcc99#ff6666#ffff66#99cc66#666699#ffffff#ff9999#99cc33#ff9900#ffcc00#ff0033#ffffff#ff9966#ff9900#ccff00#cc3399#99cc33#ffffff#ff6600#993366#cccc33#666633#66cccc#ffffff#666699活泼、快乐、有趣活泼、快乐、有趣相对前一种印象,色彩选择更加广泛,?最重要的变化是将纯白色用低饱和有彩色或者灰色取代。#cc9999#ffff99#666699#ff9900#ffff00#0099cc#cccc99#cc3399#99cc00#ff6666#ffff00#3399cc#cc6600#999999#cccc33#ff9933#ffffcc#009933#0099cc#cccccc#ff6666#ff6600#ffff66#009966#cc6633#ffcc99#cc6600#cc0066#009999#ffcc33运动型、轻快运动的色彩要强化激烈、刺激的感受,同时还要体现健康、快乐、阳光。因此饱和度较高、亮度偏低的色彩在这类印象中经常登场。#ff6666#ffff00#006699#ff9966#ffffff#0066cc#339933#ffcc33#336699#ff9900#ffffcc#336699#cc6600#cccc44#336699#99cc33#ffffff#0099cc#99cc33#ff6666#336699#336699#ffffff#99cccc#ff0033#333399#cccc00#33cc99#ffff00#336699轻快、华丽、动感华丽的印象要求页面充斥有彩色,并且饱和度偏高,而亮度适当减弱则能强化这种印象。#990066#ffcc00#cc0033#ffcc33#333399#ff0033#666699#ffff00#ff0033#ff0033#006699#ffff33#ffcc00#009999#cc3366#ff0033#cccc00#006699#cccc00#ff9933#663399#ff9933#ffff00#336699#cc3333#ffcccc#99cc00#003399#ffff00#ff6600狂野、充沛、动感狂野的印象空间中少不了低亮度的色彩,甚至可以用适当的黑色搭配。其他有彩色的饱和度高,对比强烈。#990066#ffff00#003399#cc0033#000000#003399#003399#ffff00#f00000#cc3333#cccccc#003366#cc0033#333333#cccc00#000000#99cc00#cc0033#ff0033#333333#ff9900#990066#000000#009966#666666#ff6600#333333#993333#cccc00#663366华丽、花哨、女性化女性化的页面中紫色和品红是主角、粉红、绿色也是常用色相。一般它们之间要进行高饱和的搭配。#ffff99#993399#ff99cc#ff6666#ffffff#339999#ff99cc#003399#ccff00#66cc99#ffffff#cc6699#cc3399#ffcc99#ff6666#ffcccc#ffffff#993366#cc6699#ffff00#666699#cc6699#99cc66#663366#ff33cc#cccc99#663366#cc3399#ffcc99#ff6666回味、女性化、优雅优雅的感觉很奇特,色彩的饱和度一般要降下来。一般以蓝、红之间的相邻,调节亮度和饱和度进行搭配。#cccccc#cc99cc#cc3399#ffcccc#ff99cc#ccccff#cc3399#9933cc#cc99cc#9999cc#ffffcc#ffcccc#663366#cccccc#cc99cc#ff9999#ffcccc#ff99cc#996666#cc99cc#ffcccc#cc9999#cccccc#ffcccc#ff9999#996699#ffcccc#996699#ffcccc#cc99cc高尚、自然、安稳高尚一般要用低亮度的黄绿色,色彩亮度降下去,注意色彩的平衡,页面就会显得安稳。#cccc33#ffff99#cc9933#cc9966#cccc66#669999#ff9966#996600#cccc00#cccc66#660033#cc6600#cccc00#666600#ccccff#cc9933#009999#ffcc33#999966#cccc99#339999#99cc99#669933#336633#666633#999933#cc9966#660000#cc9900#cccc99冷静、自然绿色是冷静、自然印象的主角,但是绿色作为页面的主要色彩,容易陷入过于消极的感觉传达,因此应该特别重视图案的设计。#ffff99#99cc99#666600#996633#ffff99#99cc66#006600#66cc66#ccff99#666600#cccc66#ccffcc#669933#cccc33#663300#666633#999933#cc9966#003300#669933#cccc99#006633#663300#cccc66#666600#ffffcc#999999#006633#333300#cccc99传统、高雅、优雅传统的内容一般要降低色彩的饱和度,特别是棕色很适合。前面介绍紫色也是高雅和优雅印象的常用色相。#999933#ffffcc#cc99cc#cc9966#666666#cc9999#cccc99#333333#9966cc#cccc99#666666#cc9999#996699#cccc99#669999#cc9966#999999#666666#339966#cccccc#996699#663366#999999#ccccff#996699#9999cc#ccccff#cccc99#999999#663300传统、稳重、古典传统、稳重、古典都是保守的印象,色彩的选择上应该尽量用低亮度的暖色,这种搭配符合成熟的审美。#6699cc#663366#cccc99#990033#ccff66#ff9900#666699#660033#99cc99#663300#ff9933#ffff66#990033#006633#cccc00#660033#999933#660099#993366#cccc33#666633#996600#cccc66#666600#009933#cc9900#666666#666633#cccc33#cc3366忠厚、稳重、有品位亮度、饱和度偏低的色彩会给人忠厚、稳重的感觉。这样的搭配为了避免色彩过于保守,使页面僵化、消极,应当注重冷暖结合和明暗对比。#ffffcc#cc9933#336666#336666#996633#cccc33#336633#990033#ffcc99#333366#669999#996600#993333#cc9966#003300#336633#cccc

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论