![网页配色设计手册(写给设计师的书)](https://wfqqreader-1252317822.image.myqcloud.com/cover/217/27111217/b_27111217.jpg)
3.4 绿
3.4.1 认识绿色
绿色是非常清新、自然的颜色,它来自于自然界。看见绿色,总是能够让人们想到生机勃勃的春天、清新宁静的森林、健康的蔬果。
从心理上讲,绿色会让人心态平和,给人松弛、放松的感觉。在绿色中添加些黄色,颜色变得鲜嫩,就像新抽芽的柳枝;在绿色中添加蓝色,颜色则变得清秀、豁达。
色彩情感:和平、宁静、轻松、自然、环保、生命、成长、生机、希望、青春、清秀、豁达、健康、清淡、明媚、鲜活、土气、庸俗、愚钝、沉闷。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-168.jpg?sign=1738834368-sm18yDdCrQZHsch0SXCBXUzAfnoBASil-0-fa0c92ee1f199c7b603f093d54651586)
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-169.jpg?sign=1738834368-PkNtZIShfc9hT0wUL1uePZL6njUjRicA-0-c4a86fec1ec22e5481b86d8c070993a5)
3.4.2 黄绿&苹果绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-170.jpg?sign=1738834368-fSaJjVUv0LCZavQczNOV6G4DQJoMG5kU-0-2e2da9d9e0caed7855a5c95be02b653a)
1 黄绿色性情温和,是春天的颜色,代表着无限的生机和希望。
2 网页中咖啡色与黄绿色搭配,这种在颜色上明与暗、浊与清的对比,形成了颜色碰撞的火花。
3 在网页中,图案和文字的搭配和有效的穿插,能使页面除了信息传达外,更具层次感和观赏性。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-171.jpg?sign=1738834368-phrRbAv5KD2HZyxQZ1CLLbKbAOu6wfko-0-de8a4c19a5d50ec97c8a475ac97150fe)
1 苹果绿是非常清甜的颜色,能够让人联想到青苹果甜中带酸的口感。
2 在网页中,图片形成节奏上虚实和疏密的对比,使得整个画面既有曲线带来的张力和动感,又不乏整体的稳固和均衡。
3 网页以大图为主体,非常直观、明确。
3.4.3 嫩绿&叶绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-172.jpg?sign=1738834368-VsRkeh5XroiKPdWZeYDTkWs42XhMGosN-0-8d61fb4664496bebdb7a00ed1cef1af7)
1 嫩绿色是一种非常清新、自然的颜色,它来自春天,来自自然。
2 网页中的颜色单纯,单色调的配色方案韵律平缓。
3 网页中,背景颜色有轻微的变化,不会使画面显得枯燥、单调。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-173.jpg?sign=1738834368-aZMg4NC7d09dZUVWF88S4v3r2NKbRe5b-0-494bf99e2482f49e7c67303a413f49fe)
1 叶绿色是夏天的颜色,颜色鲜亮中透着几分深沉。
2 网页中分为左右两处,左侧为网页的重要信息,右侧为播放器,这样的布局使得整个页面既有亮点又不失简洁。
3.4.4 草绿&苔藓绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-174.jpg?sign=1738834368-xgG4NvtFKNmTofdROdNby0e8qSWjSPhX-0-eaf98b4ab5a3933b42f7cf2ba81b1194)
1 草绿色清新亮丽,可以使人产生心情愉悦的视觉感受,具有较强的视觉冲击力。
2 在该网页中,圆角矩形和圆形的穿插结合,色彩填充的图形交集,既能展示重要信息,又勾勒出整个网站的风格形态。
3 作为与健康相关的网页,选择草绿色作为主色调,非常切合主题。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-175.jpg?sign=1738834368-N6QNucqKZx7Jd3joZEd2pPy2rye8p5sd-0-d325375e9e53b01660c292f2d83fcef3)
1 苔藓绿颜色明度较低,所以略带深沉、忧郁的感觉。
2 该网页中,苔藓绿只作为点缀色,在这样干净、简洁的网页中,显得非常低调。
3 网页布局紧凑,张弛有度,文字和图案的结合使得条理非常清晰。
3.4.5 芥末绿&橄榄绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-176.jpg?sign=1738834368-arlCt5wUWoEdQCN2QXd5PHc0kAnsjUNS-0-013c25c8f2b89113250f197728eff409)
1 芥末绿颜色纯度较低,而且色调偏灰,所以给人一种平缓、温柔的感觉。
2 网页中是统一的绿色,通过颜色的变化增加画面的层次感。
3 网页中飞动的元素也为画面添加了动感。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-177.jpg?sign=1738834368-yaS30vhRrxnN5re5spPUYkCUEyVghb0A-0-f159120c0db7bc8a86061d438a29c34b)
1 橄榄绿颜色明度较低,此在颜色在低调中有几分骄傲。
2 在该网页中,通过不同的颜色来划分网页区域,整个页面层次分明。
3 该网页采用单色调的配色,在视觉上营造出平衡之感。
3.4.6 枯叶绿&碧绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-178.jpg?sign=1738834368-3XcAj3mrO1aiyxxkH7ML271cwySLqsN9-0-48f3943ea0437529b3e49f64f76fbf10)
1 顾名思义,枯叶绿的颜色源于秋天枯萎的绿叶,是一种中性色,视觉感受非常舒缓、平稳,其中不乏黯淡、消沉之感。
2 该网页呈现柔和的灰色调,而且在网页中有枯叶绿作为主导色,整个页面显得非常淡雅。
3 该网页上方为图案,下方为细节,这样的网页布局虽然保守,但是非常实用。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-179.jpg?sign=1738834368-fkT9eozO3aHWZKTccKB0vlF7FMaRsSAj-0-458ff91d114d92969127d5c2eb9a23a3)
1 碧绿色是绿色中带有青色,所以碧绿色不仅有绿色的自然清新,又不乏俏皮、活泼的感觉。
2 网页中,碧绿色为背景颜色,用大面积的颜色抢占先机。
3.4.7 绿松石绿&青瓷绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-180.jpg?sign=1738834368-YmalZ3SyeplnzJzkmnxlEjQb9h10QKYF-0-ec884a53f6ce77a1b227d237e431d215)
1 绿松石绿是来自宝石的颜色,这种颜色能够让人联想到精美的宝石、热带平静的水域,是令人激动的、明亮的颜色。
2 在该网页中,三角形的构图方式不仅构图稳定,视觉上的感官延续让页面脉络清晰、不脱节,且富有节奏感。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-181.jpg?sign=1738834368-u9ua0rAiiaPdsgDbuqoXwsESMHWoImlL-0-0e2078f138ccbb421675e39829aba9a4)
1 青瓷绿的色彩纯度低,颜色呈灰色调,它有着洗尽铅华、古朴典雅的气质。
2 网页构图非常简单,内容都集中在模块中,而网页标志破框而出,就变得格外突出。
3.4.8 孔雀石绿&铬绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-182.jpg?sign=1738834368-RM53IIT8FE2WKMre9ac4B9qlN5060BLm-0-e1402a46bb43c039c130ccbdbe9a01e2)
1 孔雀石绿颜色鲜艳、热烈、饱满,是使人兴奋的颜色。
2 在该网页中,孔雀石绿只作为点缀色,它与背景形成强烈的对比。
3 网页内容丰富,利用颜色区分信息的主次。这样的方式既能展示重要信息,又勾勒出整个网站的风格形态。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-183.jpg?sign=1738834368-D2OO61zfAYLh477JESROEw1V0uIBxiV4-0-725926be00e74cc4ff3644284e411aec)
1 铬绿色颜色较暗,明度较低,所以给人一种深沉、浑厚的感觉。
2 网页属于单色调的配色方案,整个画面颜色统一,又不失变化。
3.4.9 孔雀绿&钴绿
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-184.jpg?sign=1738834368-vFwlUG0pmlUkdgHR1IbRU8rNHDeiy9Pj-0-3d4d700ed5f0d2f8c720d8d5b6dd5d40)
1 孔雀绿的颜色来自孔雀的羽毛,这种颜色华丽、冷艳,透着神秘感。
2 该网页将模块整齐划分,条理清晰,让人过目难忘。
3 该网页以灰色搭配孔雀绿,颜色明暗、纯度的对比较弱,这样的颜色搭配给人一种冷静、睿智的视觉感受。
![](https://epubservercos.yuewen.com/3A3ED0/15477649504561606/epubprivate/OEBPS/Images/AA-185.jpg?sign=1738834368-Czd8ONwCNApLzJvPKYcypmTX8Fp6FZSm-0-a4111ef00d9fd0ccdd927d4b7e25084c)
1 钴绿色颜色明度相对较高,当这种颜色面积较大时,使人心里安静、恬静,当颜色面积较小时,则非常活泼、年轻态。
2 该网页背景部分颜色轻柔,在前景中钴绿色非常跳跃,能够让前景非常突出。
3 前景中圆形的模块饱满、圆润,富有张力。