1. RGB颜色
网页颜色主要由3种基本颜色和组成,它们是红(Red)、绿(Green)、蓝(Blue)。
2. 色环
3. 颜色的三要素
色相、纯度、明度。
4. 不同颜色代表的含义
红色
红色是一种对视觉器官产生强烈刺激的颜色,在视觉上容易引起注意,在心理上容易引起情绪高昂。
红的的具体表现是:火、血、心、苹果、夕阳、婚礼、春节等。
红色的抽象表现在:热烈、喜庆、危险、革命、女性。
橙色
橙色也是一种对视觉器官产生强烈刺激的颜色,由红色和黄色组成,比红色多些明亮的感激,容易引起注意。
橙色的具体表现是:橘子、柿子、秋叶、砖头等。
橙色的抽象表现是:快乐、温情、积极、活力等。
黄色
黄色也是一种对视觉器官产生明显刺激的颜色,容易引起注意。
红色的具体表现是:香蕉、柠檬、黄金、蛋黄、帝王等。
黄色的抽象表现是:光明、快乐、豪华、注意、活力、色情等
绿色
绿色对视觉器官的刺激温和,所以一般人都知道眼睛疲倦时,看着绿色有调节和恢复作用。
绿色的具体表现是:草、植物、森林、公园、地球、安全等。
绿色的抽象表现是:新鲜、春天、有生命力、和平、安全、年轻、清爽、环保等。
蓝色
蓝色对视觉器官的刺激较弱,在光线不足的情况下不易辨认,就有缓和情绪的作用。所以在情绪波动时,看着蓝天和海洋,可以让心情平静。
蓝色的具体表现是:水、海洋、天空、游泳等。
蓝色的抽象表现是:稳重、理智、高科技、清爽、凉快、自由、忧郁等。
紫色
紫色由蓝色和红色组成,对视觉器官的刺激正好综合强弱,形成中性色彩。
紫色的具体表现是:葡萄、茄子、紫菜、紫罗兰、紫丁香等。
紫色的抽象表现是:神秘、优雅、女性化、浪漫、忧郁等。
褐色
褐色时橙色中加入了一定比例的蓝色或黑色所形成的暗色,对视觉器官刺激很弱。
褐色的具体表现是:麻布、树干、木材、皮革、咖啡、茶叶等。
褐色的抽象表现是:原始、古老、古典、稳重、男性化等。
白色
白色的自然日光是由许多种有色光组成的,白色是光明的颜色。
白色的具体表现是:光、白天、白云、雪、白纸、兔子、棉花、护士、新娘等。
白色的抽象表现是:纯洁、干净、善良、空白、光明、寒冷等。
黑色
黑色对视觉器官的刺激最弱。
黑色的具体表现是:夜晚、头发、木炭、墨、煤、黑人等。
黑色的抽象表现是:罪恶、污点、黑暗、恐怖、神秘、稳重、科技、高贵、不安全等。
灰色
灰色的白色和黑色的组合,对视觉器官的刺激微弱。
灰色的具体表现是:金属、水泥、砂石、阴天、乌云、老鼠等。
灰色的抽象表现是:柔和、科技、年老、沉闷、黯淡、空虚、中性、缺乏生命力等。
按风格进行配色
1. 清爽风格
多用白色配蓝色系或绿色系,设计以白色为主,蓝色系或绿色系的明度应较高。
因蓝色具有凉快、自由的感觉,使我们容易联想到天空、海洋;而绿色具有新鲜、清爽的感觉,容易联想到大自然、春天;和白色配合,就会感觉清新、爽快。
文字颜色可以稍微调亮,配合浅色作为过渡色。
2. 活泼风格
以白色或明度较高的颜色为主色,与黄色、绿色或多种颜色配合。注意颜色的纯度、明度应较高,颜色艳丽,看起来就会很活泼。而黄色、绿色则是两种过渡很好的色调,感觉活泼、有生气。类似的配色还有黄色配橙色或配红色等。
因为颜色多、对比度大,所以文字颜色的对比也尽量大。
3. 古典风格
以褐色系或黄色为主调,画面明度偏低。
因褐色容易产生原始的、古老的、古典的、稳重的感觉,就像中国古画,经历岁月风霜后褪色一样。
4. 科技金属风格
多用黑色或暗色为底色,配合黄色系、蓝色或灰色为前景色。
蓝色有科技的感觉,而银灰、黄色则有金属的感觉。金属外形最大的特点就是发出光芒,所以对这种风格进行配色,更重要的是通过颜色的渐变显出立体的感觉,配合白色,模仿关照的效果。
5. 科技点阵风格
多用蓝色系配合灰色或黑色。
同样的,蓝色、灰色、黑色都有科技的感觉。点阵风格最大的特点就是精致细腻,像电子线路板。所以对这种风格进行配色,更重要的是公国线条的颜色、小点的颜色显出细腻的感觉。
6. 商业化风格
多以白色为主,配以黑色或多种暗色。
黑色、蓝色等深色都具有稳重,科技的感觉。而以白色为主色调,画面明亮,颜色鲜明。可配合灰色为辅助色。
7. 总结:
版面应宽敞,显出“大气”的感觉。
按企业形象进行配色
企业形象的全称为企业形象识别系统(Corporate Identity),即CI。他是企业内而外有计划的展现形象的系统工程。对内而言,它形成企业文化;对外而言,它得到社会的认知,从而获得公信力。
CI是企业的外表形象,基本要素包括公司名称、标志、标准色、字体等。所以要对企业进行网页设计,可以考虑运用企业的标准色进行配色。另外还可以适当加以辅助色,浅灰色等明度较大的颜色不会有明显的对比效果,是作为辅助色的较佳选择。
按颜色对比进行配色
1. 同系色配色
同系色是指具有色名的颜色,如蓝、天蓝、水蓝、深蓝等。用同系色,或相邻色名的配色(色相值相邻),容易产生该颜色所表现的意境,同时利用明度的差别产生层次感,使画面更丰富。
用相邻的颜色主题可以实现色彩的融恰与融合,同自然界中看到的色彩相近。
2. 大对比色配色
和同系相反,用两种或多种色相不相邻的颜色进行配色,容易产生强烈的对比,画面鲜艳,不会有单调的感觉。
3. 和谐色配色
和谐色配色是指用亮度较高但纯度较低的颜色进行配色。由于颜色纯度低,容易形成淡灰的感觉,但把亮度调高,就形成较为淡雅的感觉。
4. 注:
亮度不能过低,否则颜色灰暗,会有沉闷、不爽快的感觉。
配色后的修饰
1. 渐变修饰
对大面积的单一颜色填充渐变色,可选择同系色的渐变,如对大面积的蓝色,可填充浅蓝色至蓝色,而不是填充对比很强的渐变色。
或者对图层设计格式,添加巴色至黑色的渐变,把混合模式设为“叠加”,然后把不透明度降低即可。
2. 底图修饰
对大面积的单一颜色填充底图,可选择颜色变化不大的底图,或选择适当的底图,设计图层混合模式为“柔光”或“叠加”。对比不能太强,也不能和文字颜色相近,否则影响文字的查看。
3. 点、线的修饰
在不同颜色的交界处加上白色线或黑色线,有助于颜色的过渡。加入少量圆、点、线,也使画面显得更精致。必要时可调节图层的混合模式为“柔光”或“叠加”。