每个人都有自己最喜欢的颜色,在工作以及生活中,当购买产品或进行艺术创作的时候,他们会选择自己喜欢的颜色。对于设计师来说也是同理。设计师偏好在设计中重复使用他们最喜欢的色系。虽然命题是无限的,但是他们还是喜欢遵循自己的审美感觉。
![网页设计配色剖析之绿色1](/Images/jiaocheng/2015-05-0704/2947805237.jpg)
推广成功、运营优秀的网站,往往让用户感觉到页面和谐感强、视觉效果符合本能审美、元素具有图像象征且与产品服务紧密联系,这归功于网页设计。
绿色的定义
绿,是一种颜色,绿色处于光谱中间,波长较短,大约为500~570nm。在减色法中,绿色不是主色,但是可以由黄色和蓝色、或者黄色和青色创造出来的。绿色是加法三原色之一。
Green
![网页设计配色剖析之绿色2](/Images/jiaocheng/2015-05-0704/2249782470.jpg)
网页设计中的绿色
绿色在网页设计中效果极佳,因而被广泛的应用。可能是因为绿色是自然中最多的颜色,绿色能够唤起一种人类对于自然的本能意识。高手能够行之有效的将绿色和其它颜色有机结合,奏出一曲色彩、色调、明暗完美互补的视觉三重奏,让人兴趣满满。
而材质的加入也能改变颜色的效果,比如,粗糙的材质表面让颜色看起来更深,平滑的表面让颜色看起来更浅。
正如色彩理论专家J.L.Morton说的那样:
成功的设计知道如何用色彩去传达意义。网页设计师应该像对待图形和布局一样认真对色彩其中蕴藏的象征意义。
绿色在心理学上具有冲击力,因此被应用于广告、机构标识和电子媒体中。想要在网络上创收的工业制造商通常会发现,官方主页上使用绿色效果很棒。
很多设计师认为,当按钮和选项采用绿色时,能够吸引更多的点击或操作,具有很强的行为召唤力
行为召唤
WedoXHTML用绿色突出了重要的信息,同时绿色的字体也易于阅读。
Wedoxhtml
![网页设计配色剖析之绿色1](/UploadFile/jiaocheng/2016/1015/1327224768.jpg)
Pagelime使用绿色,作为一种行为召唤的暗示
Pagelime
![网页设计配色剖析之绿色3](/Images/jiaocheng/2015-05-0704/3348518293.jpg)
为何选择绿色?
视觉感受器具有一些特性与限制,大多数人对于光的频谱中间部分最为敏感,比如绿色。
绿色是一种合成色,有多种用途,能够清晰的传达设计师的意图。绿色让食物看起来自然、清新、生态环保。在工业环境下,如果设备被涂上绿色,会让人感觉安全,同时也能促进生产。这种环保的感觉让人们感到洁净并不会危害到个人健康。
绿色令人放松。当一想到绿色,大多数人会想到户外和植物。因此具有平静心态的功效。
绿色能够最大化可读性,降低视觉疲劳发生的几率,这在网页设计中非常关键。还能够激发用户的视觉兴趣。
绿色的作用
绿色对人具有显著的心理冲击作用,在很多文化中非常流行。绿色使人宽心,经常在医疗设施上看到绿色。绿色降低血压,缓解神经紧张,放松大脑,启发创造,但也抑制胃口。绿色的视觉负担很小,以绿色为背景的图像看起来更有深度。
绿色虽然能够帮助人们走出焦虑和沮丧的情绪。但是如果使用过度,就让用户有种极度、仇恨、占有的负面情绪!
网页设计中不同种类的绿色
绿色对于绿色食品、保健、有机产品来说是很好的推广工具。但是要按需而定,要合理的使用。
DARK GREEN(深绿色)
通常与金钱和野心联系在一起。对于公司来说很不错。能够给用户一种强力、有名望、踏实的感觉。
Heineken
![网页设计配色剖析之绿色4](/Images/jiaocheng/2015-05-0704/3359568722.jpg)
BRIGHT GREEN(亮绿色)
象征着自然中的生机与活力。
Yodaa
![网页设计配色剖析之绿色5](/Images/jiaocheng/2015-05-0704/1074690310.jpg)
CELADON(青瓷绿)
在中国、朝鲜、日本经常使用的绿色,后来传播到其他国家,一种难以描述的优雅感。
Qilady
![网页设计配色剖析之绿色6](/Images/jiaocheng/2015-05-0704/1127117856.jpg)
YELLOW-GREEN/LIME GREEN(黄绿/柠檬绿)
因为会让人联想到反胃呕吐时的病态,要谨慎使用。对于与食物不相干的网站和保健品网站来说,是很理想的颜色。
Pado
![网页设计配色剖析之绿色7](/Images/jiaocheng/2015-05-0704/374116865.jpg)
OLIVIA GREEN(橄榄绿)
非常的愉悦视觉,安宁大方,适合公众场合。但是也有一点军事色彩。
Mocapoke
![网页设计配色剖析之绿色2](/UploadFile/jiaocheng/2016/1015/3264484466.jpg)
BLUE GREENS(青绿色)
最容易让人接受的绿色,对男女都有吸引力。
Amitkhera
![网页设计配色剖析之绿色3](/UploadFile/jiaocheng/2016/1015/850210155.jpg)
绿色与其他颜色的搭配
绿色和其它互补色搭配效果良好。互补色的定义:凡两种颜色相结合产生白色或灰色,则称其中一种颜色为另一种颜色的互补色。三组基本互补色:红色与绿色互补,蓝色与橙色互补,紫色与黄色互补。
了解了这些,就能有效的组织网页中的色彩搭配,深色与浅色的搭配一般不会差。另外值得一提的是,要避免在网页中使用多种色彩。最好开始设计时做做实验,调调明暗度,可以用互补色开始实验。现在,我们来看看绿色的配色方案。
绿色与蓝色的搭配
自然的呼唤感,新鲜而又清澈。象征着新生事物的萌芽。
Narhir
![网页设计配色剖析之绿色8](/Images/jiaocheng/2015-05-0704/4210253535.jpg)
The Forbidden Corner
![网页设计配色剖析之绿色9](/Images/jiaocheng/2015-05-0704/2425561773.jpg)
绿色与褐色,棕褐色或米黄色的搭配
这种组合,有机感强,让人感觉自然循环生生不息,也适合产品包装设计
Mailchimp
![网页设计配色剖析之绿色4](/UploadFile/jiaocheng/2016/1015/181928377.jpg)
Juandiego Velasco
![网页设计配色剖析之绿色10](/Images/jiaocheng/2015-05-0704/3534930373.jpg)
绿色与黄色与黑色/白色的搭配
三种颜色的结合(绿黄黑、绿黑白)让页面具有户外运动感
Evacare
![网页设计配色剖析之绿色11](/Images/jiaocheng/2015-05-0704/1298345513.jpg)
Bugworldexperience
![网页设计配色剖析之绿色12](/Images/jiaocheng/2015-05-0704/4012447519.jpg)
绿色与紫色/红色的搭配
对比强烈,生动并扣人心弦。
Designheartsme
![网页设计配色剖析之绿色13](/Images/jiaocheng/2015-05-0704/2701177955.jpg)
Naturestable
![网页设计配色剖析之绿色14](/Images/jiaocheng/2015-05-0704/3875298317.jpg)
绿色与橙色/黄色的搭配
柠檬绿与橙色/黄色的搭配,营造了一种如同水果的新鲜感,让人感觉非常的健康环保。
Web Banner Ad Design
![网页设计配色剖析之绿色15](/Images/jiaocheng/2015-05-0704/1673819339.jpg)
Blymp
![网页设计配色剖析之绿色16](/Images/jiaocheng/2015-05-0704/746918630.jpg)
网页设计中应用绿色的案例:机构篇
广泛应用,作用明显。
Nutrifield
![网页设计配色剖析之绿色17](/Images/jiaocheng/2015-05-0704/3204823101.jpg)
Gbados Energy Solutions
![网页设计配色剖析之绿色18](/Images/jiaocheng/2015-05-0704/57542852.jpg)
Compograss
![网页设计配色剖析之绿色19](/Images/jiaocheng/2015-05-0704/4269695724.jpg)
Blossoms Village
![网页设计配色剖析之绿色20](/Images/jiaocheng/2015-05-0704/3353002395.jpg)
Aquaadria
![网页设计配色剖析之绿色21](/Images/jiaocheng/2015-05-0704/2651874477.jpg)
Rcleaners
![网页设计配色剖析之绿色22](/Images/jiaocheng/2015-05-0704/724389285.jpg)
Daguia
![网页设计配色剖析之绿色23](/Images/jiaocheng/2015-05-0704/2665680158.jpg)
Geo Vision
![网页设计配色剖析之绿色24](/Images/jiaocheng/2015-05-0704/306218320.jpg)
Green Globe Ideas
![网页设计配色剖析之绿色25](/Images/jiaocheng/2015-05-0704/274868550.jpg)
Ecoservice
![网页设计配色剖析之绿色5](/UploadFile/jiaocheng/2016/1015/2267815211.jpg)
Gbb
![网页设计配色剖析之绿色26](/Images/jiaocheng/2015-05-0704/1729693737.jpg)
Greenanysite
![网页设计配色剖析之绿色27](/Images/jiaocheng/2015-05-0704/4223284444.jpg)
Hrasti
![网页设计配色剖析之绿色28](/Images/jiaocheng/2015-05-0704/491007421.jpg)
E Schneider Garten
![网页设计配色剖析之绿色29](/Images/jiaocheng/2015-05-0704/2481720834.jpg)
Rbc
![网页设计配色剖析之绿色30](/Images/jiaocheng/2015-05-0704/1729866081.jpg)
Sleepydog
![网页设计配色剖析之绿色31](/Images/jiaocheng/2015-05-0704/2616319140.jpg)
Biofoolish
![网页设计配色剖析之绿色32](/Images/jiaocheng/2015-05-0704/954643754.jpg)
Cobahair
![网页设计配色剖析之绿色33](/Images/jiaocheng/2015-05-0704/1994309747.jpg)
Shopify
![网页设计配色剖析之绿色34](/Images/jiaocheng/2015-05-0704/3864059821.jpg)
Sprintbio
![网页设计配色剖析之绿色6](/UploadFile/jiaocheng/2016/1015/3342235170.jpg)
Liptongreenmint
![网页设计配色剖析之绿色35](/Images/jiaocheng/2015-05-0704/2176950933.jpg)
Organic Supermarket
![网页设计配色剖析之绿色7](/UploadFile/jiaocheng/2016/1015/3228756931.jpg)
Reallywildtravel
![网页设计配色剖析之绿色36](/Images/jiaocheng/2015-05-0704/2113453043.jpg)
Oypro
![网页设计配色剖析之绿色37](/Images/jiaocheng/2015-05-0704/1961605050.jpg)
Outdooritalia
![网页设计配色剖析之绿色38](/Images/jiaocheng/2015-05-0704/1164750758.jpg)
Terrasse Concept
![网页设计配色剖析之绿色39](/Images/jiaocheng/2015-05-0704/1480314195.jpg)
网页设计中应用绿色的案例:机构篇
Anna Pawelczyk
![网页设计配色剖析之绿色8](/UploadFile/jiaocheng/2016/1015/2301722126.jpg)
Quadrifolia
![网页设计配色剖析之绿色40](/Images/jiaocheng/2015-05-0704/2490031569.jpg)
Tyler Web Design
![网页设计配色剖析之绿色9](/UploadFile/jiaocheng/2016/1015/2714275181.jpg)
Snailbird
![网页设计配色剖析之绿色41](/Images/jiaocheng/2015-05-0704/2348838282.jpg)
Anandakm
![网页设计配色剖析之绿色42](/Images/jiaocheng/2015-05-0704/2391929311.jpg)
Artist in design
![网页设计配色剖析之绿色43](/Images/jiaocheng/2015-05-0704/1040737806.jpg)
Inspirationbit
![网页设计配色剖析之绿色10](/UploadFile/jiaocheng/2016/1015/54340887.jpg)
Ladysign
![网页设计配色剖析之绿色44](/Images/jiaocheng/2015-05-0704/3210495924.jpg)
Paulicio
![网页设计配色剖析之绿色45](/Images/jiaocheng/2015-05-0704/1764441524.jpg)
网页设计中绿色的应用案例:独立设计师篇
Cgalvin
![网页设计配色剖析之绿色46](/Images/jiaocheng/2015-05-0704/2965687951.jpg)
Pestovo Golf
![网页设计配色剖析之绿色47](/Images/jiaocheng/2015-05-0704/121083455.jpg)
Sageblue
![网页设计配色剖析之绿色48](/Images/jiaocheng/2015-05-0704/3320416045.jpg)
Somoslaperalimonera
![网页设计配色剖析之绿色49](/Images/jiaocheng/2015-05-0704/2014207532.jpg)
Studio7designs
![网页设计配色剖析之绿色50](/Images/jiaocheng/2015-05-0704/1811195564.jpg)
Viget
![网页设计配色剖析之绿色51](/Images/jiaocheng/2015-05-0704/988039060.jpg)
Blogfullbliss
![网页设计配色剖析之绿色52](/Images/jiaocheng/2015-05-0704/318854968.jpg)
Ztradycja w nowoczesnosc
![网页设计配色剖析之绿色53](/Images/jiaocheng/2015-05-0704/2827335973.jpg)
Growmedia
![网页设计配色剖析之绿色54](/Images/jiaocheng/2015-05-0704/3476015666.jpg)
绿色调色工具
Colourlovers: 有一些非常棒的绿色
Colorcombos: 便捷高效
Colorscheme: 在线的组织,用户可以分享自己的绿色主题。
保护环境
保护环境人人有责,必须要注意到对环境的保护,资源的合理利用,让自然的循环更加和谐有机。