色彩三要素.ppt

1、色彩三要素,色彩的三要素： 明度、色相、饱和度。,色相：,色彩是由于物体上的物理性的光反射到人眼视神经上所产生的感觉。色的不同是由光的波长的长短差别所决定的。作为色相，指的是这些不同波长的色的情况。波长最长的是红色，最短的是紫色。把红、黄、绿、蓝、紫和处在它们各自之间的黄红、黄绿、蓝绿、蓝紫、红紫这5种中间色共计10种色作为色相环。在色相环上排列的色是纯度高的色，被称为纯色。这些色在环上的位置是根据视觉和感觉的相等间隔来进行安排的。用类似这样的方法还可以再分出差别细微的多种色来。在色相环上，与环中心对称，并在180度的位置两端的色被称为互补色。,明度：,表示色所具有的亮度和暗度被称为明度。计算

2、明度的基准是灰度测试卡。黑色为0，白色为10，在010之间等间隔的排列为9个阶段。色彩可以分为有彩色和无彩色，但后者仍然存在着明度。作为有彩色，每种色各自的亮度、暗度在灰度测试卡上都具有相应的位置值。彩度高的色对明度有很大的影响，不太容易辨别。在明亮的地方鉴别色的明度比较容易的，在暗的地方就难以鉴别。,饱和度：,用数值表示色的鲜艳或鲜明的程度称之为彩度。有彩色的各种色都具有彩度值，无彩色的色的彩度值为0，对于有彩色的色的彩度（纯度）的高低，区别方法是根据这种色中含灰色的程度来计算的。彩度由于色相的不同而不同，而且即使是相同的色相，因为明度的不同，彩度也会随之变化的。,-:)欢迎访问源码下载吧(

3、:- 首页 文章中心 下载中心 繁體中文 下载首页 Asp源码 .Net源码 Php源码 Jsp源码 Cgi源码 Flash源码 网站模板 建站素材 其他源码 学院首页 | 网页设计 | 平面设计 | 网络编程 | 数据库 | 免费资源 | 服务器 | SEO知识 | Css教程 | Dreamweaver 教程 搜索: 热门搜索 动易 科讯cms 风讯cms 动网论坛 织梦cms 帝国cms 论坛 IIS7 新云模板 MySQL SqlServer 会员登录/控制面版您的位置: 首页 网页设计 网页配色 详细内容 推荐文章 该分类还没有添加任何内容！ 热点文章 网页色彩搭配的内涵 网页留白的

4、艺术 网页上的视觉传达与艺术表现. 五彩缤纷建网页（4）背景与字. 五彩缤纷建网页（3）色彩的象. 五彩缤纷建网页（2）色彩的基. 五彩缤纷建网页（1） 网页设计中排版与布局小基础. 按颜色分类：黑色和白色（Bl. 按颜色分类：紫红色系（Red . 相关文章 组图常用配色基本概念及精相关彩实例剖析(1) 百度搜索 常用配色基本概念及精相关彩实例剖析(1) 阅览次数: 本日：2 本周：3 本月：6 总数：42 文章来源: 不详 原文作者: 佚名 整理日期: 2008-10-1 16:45:07 返回上一页 打 印 字体大小: 小 中 大,补色, 补色：是广义上的对比色。在色环上划直径，正好相对（

5、即距离最远）的两种色彩互为补色。如：红色是绿色的补色；橙色是蓝色的补色；黄色是紫色的补色。补色的运用可以造成最强烈的对比。, 补色网页例图：,补色分析：选用了一组红绿对比色，极赋视觉冲击力、所表现出的性格异常鲜明。我们看到RGB中绿色的数值显示情况符合复色的条件，因此注定了该颜色明度稍暗、纯度较低的特性，而红色R数值118构成了该色的主要成份，其他G72，B61数值接近，纯度和亮度相对绿色较高，因此2色在构成色彩空间差距上拉大。HSB中2色的S数值也显示出，它们的饱和度相差较大。结论：补色最能传达强烈、个性的情感。纯度稍低的绿色为背景的大面积使用，对比并突

6、出了前景纯度明度较高的面积较小红色的图形，形成了视觉中心重点突出，达到主次分明的主题效果。红绿、橙蓝、黄紫这三组补色中，前两种使用得最频繁。这三组补色搭配出的最终效果和目的，可以用两个字来概括强烈！,邻近色, 邻近色：是在色环上任一颜色同其毗邻之色。邻近色也是类似色关系，只是范围缩小了一点。例如红色和黄色，绿色和蓝色，互为邻近色。, 邻近色网页例图：,邻近色分析：上图选用了红色、黄色为邻近色示例，主要在色相上做区别丰富了页面色彩上的变化。RGB数值上看，以上5色R的数值都很高，仅是微妙的不同。其中浅黄色的B为138，因此在HSB数值中纯度S显示最低，为46%；5色RGB中G的数值都不同，色相、

7、明度也产生相应的不同。从数值上分析整体看来，5色都有在同一频率的变化。结论：由于是相邻色系，视觉反差不大，统一、调和，形成协调的视觉韵律美，相较显得安定、稳重的同时不失活力，是一种恰到好处的配色类型。,同类色, 同类色：比邻近色更加接近的颜色，它主要指在同一色相中不同的颜色变化。例如，红颜色中有紫红、深红、玫瑰红、大红、朱红、桔红等等种类，黄颜色中又有深黄、土黄、中黄、桔黄、淡黄、柠檬黄等等区别。它起到色彩调和统一，又有微妙变化的作用。, 同类色网页例图：,同类色分析：选用红色系4种同类色示例，主要在明度上做区别变化。由于是红色系，4色RGB数值中的R，数值都很高，且相当。从HSB数值看出，明

8、度越高的颜色饱和度越低。这4种同类色相来看，明度在强中弱的节奏中的缓和的进行变化。结论：第一眼看上去给人温柔、雅致、安宁的心理感受，便可知该组同类色系非常调和统一。只运用同类色系配色，是十分谨慎稳妥的做法，但是有时会有单调感。添加少许相邻或对比色系，可以体现出页面的活跃感和强度。,暖色, 暖色：指的是红、橙、黄、这类颜色。暖色系的饱和度越高，其温暖特性越明显。可以刺激人的兴奋性，使体温有所升高。, 暖色网页例图：http:/www.mrwong.de,暖色分析：由于是暖色系，以上3种颜色RGB数值中R的含量为主导，B都为0，暖度强度倾向在G的添加黄色成份变化中可以看到，较规律的数值变化、较有视

9、觉节奏感。HSB中纯度S和明度B都达到最高值，是鲜艳夺目的搭配色组合。结论：高明度高纯度的色彩搭配，把页面表达得鲜艳炫目，有非常强烈刺激的视觉表现力。充分体现了暖色系的饱和度越高，其温暖特性越明显的性格。,冷色, 冷色：指的是绿、青、蓝、紫等颜色，冷色系亮度越高，其特性越明显。能够使人的心情平静，清爽，恬雅。, 冷色网页例图：http:/www.portaldemoda.pt,冷色分析：该网页示例主要选用了邻近色系蓝色绿色和同类色的明度变化。其中3种蓝色系的RGB数值从二位数到三位数，随着明度的递增的同时，由低到高在有规律有节奏的变化。HSB的数值SB也相对随着同比变化，纯度S的含量都不大，因

10、此这几组色彩相对含蓄柔和。绿色系RGB数值G的色相明显，相应添加了高亮度的黄色R，使色彩较鲜艳明快。HSB数值SB也显示出其高纯度高亮度的特性。结论：冷色系的亮度越高，其特性越明显。单纯冷色系搭配视觉感比暖色系舒适，不易造成视觉疲劳。蓝色、绿色是冷色系的主要系，是设计中较常用的颜色，也是大自然之色，带来一股清新、祥和安宁的空气。 本部分小结： 从以上例子可看出三原色视觉冲击力最强，也最是刺目的，容易制造冲突、烦燥、不舒适的心情，所以是较难掌握的配色，大面积大范围使用要慎重。间色是由三原色中的两色调配二次，间于原色和复色之间，属于中性色，视觉冲击力次之，颜色的刺激缓和不少，给人舒适、愉悦的心情，

11、是较容易掌握的配色，也是在设计中使用得比较多的颜色。复色是由两种间色或原色与间色相混合而产生的颜色，呈灰色阶，视觉冲击力更弱，柔和但是使人沉闷压抑。复色调配好了，能体现出高层次高素养的成熟特性魅力，也称为高级灰，是很经看的颜色。由上可知，颜色相互混合的越多，饱和度越低，视觉冲击力越弱。 色彩运用到一定程度后，应该逐渐认识到在一个环境、区域范围里，色彩的属性、性能特性是相对的。例如黄色在蓝色、绿色这两个区域环境下，黄色可以说这个时候是呈暖色，而出现在桔红、朱红、深红这几个区域环境下，黄色可以说在这个时候是呈冷色。同样的，蓝色相对绿色是冷色，紫色相对蓝色是暖色等等。可根据网页设计主题的目的要求，环境协调度的需要等等做相应的搭配调整。 RGB三者的数值越接近，色阶较趋于直线平稳，呈灰阶，网页对视觉的刺激性越缓慢、柔和；RGB三者的数值相互间差距越大，色阶曲线波动就大，网页对视觉的刺激性越迅速、强烈。HSB数值中SB相应数值越高，视觉刺激度越强烈。抓住以上这些规律及色彩特性，在以后的网页设计配色中，根据不同的需要配置不同的颜色，来达到某些不同的目的和效果。通过RGB数值和HSB数值的计算，能帮助更科学理性的分析判断，为的是更准确的研究分析网页设计配色的协调性、合理性、掌握其规律性。有经验的