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

网页设计中常用色调格局讲解训练（2） --柔美、淡雅的中性色 何为中性色 ？ 在我看来,中色调应属于网页设计色彩中,颜色纯度偏高的色调称为中色调. 色相对比 是指因色相之间的差别形成的对比。当主色相确定后，必须考虑其他色彩与主色相是什么关系，要表现什么内容及效果等，这样才能增强其表现力。不同色相对比取得的效果有所不同，两色越接近，对比效果越柔和。越接近补色，对比效果越强烈。  　→ 色相对比网页例图：  色相对比分析：　　主要是以绿色与蓝色之间的色相对比。从HSB数值上可看出嫩绿色的S纯度高B亮度也很高，因此艳丽的颜色作为背景与前景纯度稍低的墨绿和轱蓝色形成色相之间的对比。前景的墨绿虽然纯度达到最高值100％，比主色调高不少，但是因为亮度低，因此色彩显示没有主色调明艳。　　结论：　　该页面色相的对比，主要作用于前景与背景的对比、局部与整体的对比。 纯度调整降低冷暖两色纯度。用明度黑、白、灰变化来调整画面的层次、直接使用黑、白、灰色系进入画面搭配，或者加入补色的谐调，也都能很好的起到协调的效果。　　 ??? → 纯度调整网页例图：http:// ? 紫色深紫色网页例图：  紫色系分析：（深紫色）　　以略有渐变色为背景主色调，渐变色是调和方法之一，起到增加层次感空间感柔和视觉的作用。背景色左上最亮处的特殊处理，主要起到突出了标志的作用。　　从HSB模式H色相数值上看到辅助色依旧以主色调延伸而成，仅在明度上做了些变化，属于同类色的调和色系。　　点睛色皆选用了色彩色系中明度最高的黄色及相近色黄绿、玫瑰红。黄色和黄绿色真就点睛之笔——黄色是紫色的对比色，深紫色背景上的高明度黄色被衬托得异常跳跃。黄绿色既和谐又增添了页面配色的高强度节奏。玫瑰红在这里是最温暖的颜色，协调且增强了页面配色的层次感。根据各颜色的特质，在视觉上成功做了先后次序的引导。白色虽是非色彩，但也起到拉大色彩之间色阶层次的作用，增强了页面空间感，也使以上配色更调和。　　结论： 　　　　深紫色给人华贵、深远、神秘、孤寂、珍贵的心理感受。较暗色调的紫色可以表现出成熟沉稳的感觉，创造、谜、忠诚、神秘、稀有。　　整个页面配色尤其是点睛色的妙用，使得整个页面非常新颖别致，极赋现代都市气息。 绿色高纯度网页例图：http://www. 绿色系分析： (高纯度配色：绿色+对比色组合)　　HSB数值H显示60度为正黄色，该主、辅色调只向绿色倾斜了一丁点--H为75度。大面积明度稍低的黄绿色为主要色调，饱和度却非常高，达到了100%，辅助色使用了提高明度的嫩绿色和白色，这两种辅色除了增加页面的层次感的同时，还能让整个页面配色有透亮的感觉，增强了绿色的特性。背景深褐色无疑把前景的所有纯色烘托得都耀眼于舞台上。　　该页面有两组小小的对比色，一组是黄绿与橙红色，一组是橙黄色与天蓝色，这两组配色严格的来说不算对比色，因为色彩多少有些偏差。虽然它们的饱和度降低，但在这个页面中足以构成了最响亮的色调，把整个页面烘托得非常活跃、鲜明。　　结论：　　主、辅色调黄绿色大面积使用并不刺目，反而使得页面看起来很有朝气、活力。　　适当运用不同纯度的不是相当严格意义上的对比色系组合时，通常能起到的主要作用是主次关系明确。不标准的对比色系对比特性虽然减弱，页面色彩看起来容易协调、柔和，但一样能突出主题。 橙色系高纯度高对比度（橙红色+绿色） → 橙色高纯度对比应用网页例图：　 橙色系高纯度高对比度（橙红色+绿色）分析：　　与上组的橙色绿色相比，这组颜色强烈而刺激，色彩倾向无疑明确了很多。主色调橙红色往红色倾向，而红色的对比色是绿色，因此整组颜色有强烈的对比效果。从HSB数值H上看，除了蓝色外，其余几种颜色纯度都非常高，加上又是近于红绿对比色。页面的刺激强度是可想而知的强烈。　　黄色是中间色，起到过渡对比色作用，在这组色里属于调和色。蓝色出现在产品图案上，引导主次关系，增强视觉的注目点。　　结论：　　橙色是注目容易引起食欲的颜色，在这里得到了较充分的应用。　　非色彩的白色和黑色在这里起到了非常重要的作用，拉大了色彩色阶空间的距离。白色让整个色调组合更加明快，而黑色增添色彩的厚重质感——强烈中的强烈，增强对产品的视觉刺激。　　　 作业要求 3组中色系网页格局图初步绘制 (不限颜色) * 而这并不代表网页设计中的谈色调就是纯粹的高纯度,我们所表现的中色,是所有适合这一色调的网页设计模式中以中色调为主色调! *