网页版式设计-8 中性色.ppt

• 网页设计中常用色调格局讲解训练（2）--柔美、淡雅的中性色 • 何为中性色 ？ • 在我看来,中色调应属于网页设计色彩中, 颜色纯度偏高的色调称为中色调.而这并不代表网页设计中的谈色调就是纯粹的高纯度, 我们所表现的中色,是所有适合这一色调的网页设计模 式中以中色调为主色调!• 色相对比 • 是指因色相之间的差别形成的对比当主色相 确定后，必须考虑其他色彩与主色相是什么关 系，要表现什么内容及效果等，这样才能增强 其表现力不同色相对比取得的效果有所不同 ，两色越接近，对比效果越柔和越接近补色 ，对比效果越强烈 → 色相对比网页例图： • 色相对比分析：主要是以绿色与蓝色之间的色相对比从 HSB数值上可看出嫩绿色的S纯度高B亮度也很高 ，因此艳丽的颜色作为背景与前景纯度稍低的 墨绿和轱蓝色形成色相之间的对比前景的墨 绿虽然纯度达到最高值100％，比主色调高不少 ，但是因为亮度低，因此色彩显示没有主色调 明艳结论：该页面色相的对比，主要作用于前景与背 景的对比、局部与整体的对比• 纯度调整 降低冷暖两色纯度用明度黑、白、灰变 化来调整画面的层次、直接使用黑、白、 灰色系进入画面搭配，或者加入补色的谐 调，也都能很好的起到协调的效果。

→ 纯度调整网页例图：http:// 紫色深紫色网页例图： •紫色系分析：（深紫色）以略有渐变色为背景主色调，渐变色是调和方法之一，起到增 加层次感空间感柔和视觉的作用背景色左上最亮处的特殊处理， 主要起到突出了标志的作用从HSB模式H色相数值上看到辅助色依旧以主色调延伸而成，仅 在明度上做了些变化，属于同类色的调和色系点睛色皆选用了色彩色系中明度最高的黄色及相近色黄绿、玫 瑰红黄色和黄绿色真就点睛之笔——黄色是紫色的对比色，深紫 色背景上的高明度黄色被衬托得异常跳跃黄绿色既和谐又增添了 页面配色的高强度节奏玫瑰红在这里是最温暖的颜色，协调且增 强了页面配色的层次感根据各颜色的特质，在视觉上成功做了先 后次序的引导白色虽是非色彩，但也起到拉大色彩之间色阶层次 的作用，增强了页面空间感，也使以上配色更调和结论： 深紫色给人华贵、深远、神秘、孤寂、珍贵的心理感受较暗 色调的紫色可以表现出成熟沉稳的感觉，创造、谜、忠诚、神秘、 稀有整个页面配色尤其是点睛色的妙用，使得整个页面非常新颖别 致，极赋现代都市气息 绿色高纯度网页例图：http://www. •绿色系分析： (高纯度配色：绿色+对比色组合)HSB数值H显示60度为正黄色，该主、辅色调只向绿色倾斜了一 丁点--H为75度。

大面积明度稍低的黄绿色为主要色调，饱和度却 非常高，达到了100%，辅助色使用了提高明度的嫩绿色和白色，这 两种辅色除了增加页面的层次感的同时，还能让整个页面配色有透 亮的感觉，增强了绿色的特性背景深褐色无疑把前景的所有纯色 烘托得都耀眼于舞台上该页面有两组小小的对比色，一组是黄绿与橙红色，一组是橙 黄色与天蓝色，这两组配色严格的来说不算对比色，因为色彩多少 有些偏差虽然它们的饱和度降低，但在这个页面中足以构成了最 响亮的色调，把整个页面烘托得非常活跃、鲜明结论：主、辅色调黄绿色大面积使用并不刺目，反而使得页面看起来 很有朝气、活力适当运用不同纯度的不是相当严格意义上的对比色系组合时， 通常能起到的主要作用是主次关系明确不“标准“的对比色系对比 特性虽然减弱，页面色彩看起来容易协调、柔和，但一样能突出主 题 橙色系高纯度高对比度（橙红色+绿色） → 橙色高纯度对比应用网页例图： •橙色系高纯度高对比度（橙红色+绿色）分析：与上组的橙色绿色相比，这组颜色强烈而刺激，色彩倾向无疑 明确了很多主色调橙红色往红色倾向，而红色的对比色是绿色， 因此整组颜色有强烈的对比效果从HSB数值H上看，除了蓝色外， 其余几种颜色纯度都非常高，加上又是近于红绿对比色。

页面的刺 激强度是可想而知的强烈黄色是中间色，起到过渡对比色作用，在这组色里属于调和色 蓝色出现在产品图案上，引导主次关系，增强视觉的注目点结论：橙色是注目容易引起食欲的颜色，在这里得到了较充分的应用 非色彩的白色和黑色在这里起到了非常重要的作用，拉大了色 彩色阶空间的距离白色让整个色调组合更加明快，而黑色增添色 彩的厚重质感——强烈中的强烈，增强对产品的视觉刺激 • 作业要求 • 3组中色系网页格局图初步绘制 • (不限颜色) 。