配色笔记整理(3)——经典颜色搭配

苏州/UI设计师/8年前/5588浏览
配色笔记整理(3)——经典颜色搭配
sayayao

不知道有多少人跟我一样,做的是无形商品,做banner或海报的时候既没有商品也没有模特。

所以配色的时候总觉得不知道怎么配,如果单纯用LOGO色,那做出来的banner就都是一个色系的,如果不用LOGO色,那就需要根据文案所表达的意思来进行

不知道有多少人跟我一样,做的是无形商品,做banner或海报的时候既没有商品也没有模特。

所以配色的时候总觉得不知道怎么配,如果单纯用LOGO色,那做出来的banner就都是一个色系的,如果不用LOGO色,那就需要根据文案所表达的意思来进行配色。

慢慢的就大概掌握了几种经典配色,下面介绍几种我比较常用的几种颜色。

 

一:蓝色+白色——商务大气、教育、科技未来,诚信


这是我最常用的,因为真的很百搭(可能也跟所在行业有关,无形商品需要表现可信度和商务范)

一般做这种banner海报或者h5时,我都会先去找一些相似主题色的网站找参考(也可以在花瓣搜),看他们怎么配色

 35e3596f6385a8012193a335f210.jpg

 

1:科技感:网易云,百度云,腾讯云,阿里云…

这些都是表现高科技的网站,做的很有科技感而且好看,交互也很棒,大家可以看看

 以前我要做科技感的东西,一般都会先去素材网站搜索科技感的元素和背景,一般背景都是这种感觉…(不能收它难看,但确实比较一般,没有高端的感觉)

6d58596f63afa8012193a3124c74.jpg

后来我发现去这些大公司的网站找灵感还是比较靠谱的,让人眼前一亮,原来科技感还能这么做

 

分析:这些banner都是以蓝色为背景色,文案是白色,给人清新的科技感。

为什么虽然颜色不多,但这几个banner看起来都不单调呢?

那是因为banner里面不止蓝色,颜色在下面红框这个区间内变化:有偏紫色的蓝,有偏青色的蓝,还有淡蓝(配合透明度变化)所以看起来不单调,也不花哨。(渐变风格的插画也是相同原理,颜色不多但不单调)

7fef596f6410a8012193a31e80c7.jpg

 

 

2:教育、招聘、金融、知识,社交、旅游、医疗:有道云、支付宝、陌陌…

这些网站也经常用蓝+白配色,但不是为了表达科技感,而是为了表现诚信、知识等,对很多行业来说都可用

 

有道云


陌陌

8cb0596f643aa8012193a3973dad.jpg

支付宝


da74596f6450a8012193a3547eed.jpg

医疗:

a1eb596f6791a8012193a3bb13f5.jpg

 


二:蓝色+黄色

比蓝白热闹点,层次更多

90a1596f646ba8012193a3fa59d3.jpg

运用场景:就是当文案很多,然后有些需要强调的时候

因为有时候文案全是白色会主次不分



也可以做活动的时候用,既有气氛,又不会太夸张

facb596f64a2a8012193a3b1b160.jpg

 


三:红+黄

ce69596f6c29a8012193a39ecc0d.jpg

黄色和红色的搭配在做活动的时候经常用,尤其是天猫京东做活动时,这里就不多举例子了。

8a06596f685da8012193a34bdf58.jpg



四:黄+黑

05ed596f6d52a8012193a3d12096.jpg

这个颜色是最近经常见到的颜色,比如站酷,美团外卖等,活力四射,有点卡通手绘的感觉,可以运用在活动中,适合年轻人

(很想用这个配色,可惜最近工作中没有这个需求……)

e295596f6c7aa8012193a3a7892b.jpg

黑色和黄色搭配时,很多会搭配描边风格,看起来很酷。

1268596f6c88a8012193a3cc0244.jpg



五:金+黑

金色和黑色的搭配也很经典,低调奢华,可以用在高大上的邀请函等地方

e9d4596f7053a8012193a3e3309d.jpg


掌握几种经典配色之后,工作中突然要做某个东西时,如果给的时间不多,那么这么配色至少不会错

上面就是最近我比较常用的颜色,有空会再整理一波,主要还是平常欣赏别人的设计时,要看别人设计好在哪里,多做总结。


69
Report
|
103
Share
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
大家都在看
Log in