建站常识
网页设计配色基础:色彩三属性与实例剖析
2006-08-22 07:59:00
许多初学者对色彩的属性和原色概念模糊,容易混淆,下面我们就先从几个概念入手。今天介绍色彩的三个属性。
颜色可以分为非彩色和彩色两大类。非彩色指黑色、白色和各种深浅不一的灰色,而其他所有颜色均属于彩色。从心理学和视觉的角度出发,彩色具有三个属性:色相、明度、纯度(彩度)。
■ 明度(Value):
也叫亮度,指颜色的深浅、明暗程度,没有色相和饱和度的区别。不同的颜色,反射的光量强弱不一,因而会产生不同程度的明暗。非色彩的黒、灰、白较能形象的表达这一特质。

明度的递增
明度分析:
从上图网页所选取的4个主要色块的RGB数值来看,这4块色彩组合显示的RGB数值很高,接近于最高值255。RGB相互间的数值相近,由于有RG的高数值与B高数值混合,整个网页给人的感觉非常协调,柔和雅致,心情愉悦。
结论:
RGB同时呈现相近的高数值时,相近等量的色彩相互混合,页面呈高明度灰色段,协调的柔和状态,令人遐想,对视觉刺激是缓慢的,适合长时间观看。但由于数值接近,因此色阶平稳,同时存在着不够醒目的状态。
颜色可以分为非彩色和彩色两大类。非彩色指黑色、白色和各种深浅不一的灰色,而其他所有颜色均属于彩色。从心理学和视觉的角度出发,彩色具有三个属性:色相、明度、纯度(彩度)。
![]() 基本色相环 |
■ 色相(Hue): 也叫色调,指颜色的种类和名称,是指颜色的基本特征,是一种颜色区别于其他颜色的因素。色相和色彩的强弱及明暗没有关系,只是纯粹表示色彩相貌的差异。如红、黄、绿、蓝、紫等为不同的基本色相。 |
■ 明度(Value):
也叫亮度,指颜色的深浅、明暗程度,没有色相和饱和度的区别。不同的颜色,反射的光量强弱不一,因而会产生不同程度的明暗。非色彩的黒、灰、白较能形象的表达这一特质。

明度的递增
→ 明度网页例图:http://www.once-upon-a-forest.com |
![]() |
从上图网页所选取的4个主要色块的RGB数值来看,这4块色彩组合显示的RGB数值很高,接近于最高值255。RGB相互间的数值相近,由于有RG的高数值与B高数值混合,整个网页给人的感觉非常协调,柔和雅致,心情愉悦。
结论:
RGB同时呈现相近的高数值时,相近等量的色彩相互混合,页面呈高明度灰色段,协调的柔和状态,令人遐想,对视觉刺激是缓慢的,适合长时间观看。但由于数值接近,因此色阶平稳,同时存在着不够醒目的状态。
上一篇:WEB网页设计中的全色系颜色表
下一篇:网页设计配色基础:RGB与HSB
近期更新
- [2021-01-15] 建设网站细节也十分重要
- [2020-12-09] 网站颜色对于网站建设来说有什么样的影响?
- [2020-11-27] 网站建设时,设计首页时务必要重视的几点
- [2020-11-25] 青岛网站建设时如何选择图片?
- [2020-11-18] 建设营销型网站有什么注意事项?
- [2020-10-30] 青岛网站建设前期有什么必需的工作?
- [2020-10-21] 手机端网站设计的必要性有什么?
- [2020-09-14] 在青岛,企业网站建设对企业有哪些作用?
- [2020-09-07] 手机建站时容易进入哪些误区?
- [2020-08-11] 网站建设的误区
- [2020-07-29] 青岛网站设计、网站内页设计需要提供什么资料?
- [2020-07-14] 青岛网站建设在网站设计方面有哪些特色?
延伸阅读
- [2016-09-29] 网站制作访客至上的设计秘笈
- [2010-01-27] 自然描述与自然任务
- [2019-05-06] 定制网站和模板网站的区别在哪
- [2019-05-17] 青岛营销型网站建设
- [2007-11-06] 活动网站设计点评之SONY VAIO C
- [2010-08-09] 模块标签(Module Tabs)_Yahoo_Pattern(翻译)
- [2009-11-12] 视觉设计前瞻实用性研究(PNVD) 第一期
- [2009-07-22] Web设计的成就感
- [2009-03-06] 不要忽略了颜色的可用性
- [2006-12-21] 网页布局的位置重心与位置间的对比关系
- [2018-09-13] 苹果发布史上最贵iphone,双卡特供中国
- [2013-03-06] 图片中的文字转换成word