分享

8招色彩对比,搞定设计!

 清观 2022-04-28

对比手法一直都是设计师最常见的手法,也广泛的运用在多个领域,今天我们就来说一说,对比手法里的色彩对比。

红、橙、黄、绿、蓝、紫是我们生活中最常见的颜色,不同的颜色之间的组合更是不可穷尽。通过色彩对比的搭配,展示不一样的效果,给人的感受也不同,色彩之间的关系也非常复杂,今天的话题我们就绕着色彩对比,让大家了解一下色彩中的美感。

老规矩,大家记得点赞收藏!喜欢记得关注设长!在设计中给你带来最前沿的干货!

什么是色彩对比

色相、明度、饱和度的不同产生了对比,通过对这三个的调整,形成色彩对比,对比色可以加强整体的视觉效果,想让设计效果变得脱颖而出,更有冲击力,做出鲜艳明快的效果,那不妨可以试一试色彩对比的效果。

图片

上图中,人物在不同的颜色色块中,表现出不一样的视觉效果,刻意的营造色彩对比,可以很清晰的体现画面中不同信息,产生良好的视觉平衡。

色彩对比的分类

色彩对比的运用有很多种,不同色彩色调的调和,展现的也是不同设计效果,分别有原色,同类色,邻近色,类似色、中差色、对比色、互补色、亮暗色等对比,这些设计效果能够产生一定的视觉冲击力。

在24色相环上为例

原色(基色):此颜色(0°);

同类色:与此色相间隔1色左右(15°±)

类似色:与此色相间隔2色左右(30°±);

邻近色:与此色相间隔4色左右(60°±);

中差色:与此色相间隔6色左右(90°±);

对比色:与此色相间隔8色左右(120°±);

互补色:与此色相间隔12色左右(180°±)。

图片

图片

01

原色对比

红,蓝,黄这三种原色是色环上最极端的三个颜色,三种颜色都有很强烈的视觉表现力。人眼决定颜色的神经细胞就只有三种,我们使用原色来进行对比,可以产生很强烈的色彩冲突。

图片

图片图片

02

同类色对比

同类色对比就是选择一种颜色,然后对这种颜色进行不同明度,不同饱和度和不同纯度变化,产生对比。一般是在选择这种颜色的色相环上为15°之间的颜色,这样的差别不会太大。给人一种很舒服很整体的效果!但又富有变化。

图片图片图片

03

类似色对比

类似色是色相环上30°左右的色彩,类似色要有共同的色素,色相上也要选择对比差比较小的,比如红色和橙色,橙色和黄色,黄色和绿色等。并且要注意类似色中明度和纯度控制比,将类似色调整到一个舒服的状态。类似色能保持设计画面上的协调感,并且通过明度和纯度的调整对比,可以达到高级质感的配色!

图片图片图片

04

邻近色对比

邻近色是以色相环上以原色为中心,左右60°以内的色彩,都可以称之为邻近色。例如红色和黄色,绿色和蓝色。通常邻近色之间是你中有我,我中有你的视觉效果。色相,冷暖,色调都统一和谐,所以邻近色可以保持画面的统一感,画面显得很丰富,活泼,在色彩表现上也有主有次。

图片

05

中差色对比

中差色是24色相环上90°之间的颜色对比,中差色相较于邻近色,可以看出来它显得更加活泼、跳跃、有动感,同时也不会失去统一感。通常是黄与红、红与蓝、蓝与绿等搭配对应。由于画面色彩的进一步增强,画面效果会更丰富。

图片图片图片

06

对比色对比

对比色是24色相环上120°之间的颜色对比,对比色本身就可以产生很有趣的视觉效果,对比色可以使人产生不同温度感觉的各种色彩,在视觉上,对比颜色上存在着一定的空间暗示,产生视觉上的远近空间透视效果,近处的颜色可以选择偏暖,纯度高,对比强的色彩感觉距离近,让画面看起来更加生动。

图片

图片

图片

07

互补色对比

互补色就是色环上180°左右的颜色,就是激烈的色相组合,红绿、蓝橙这些都是互补色,互相对抗,就是猛!刚!烈!正是互补色对比性强烈,在视觉上会产生极大的隔离作用,所以我们要很好的化解互补色之间的冲突感,通常可以选择面积比来达到平衡,选择一种颜色作为主色调,大面积的使用,小面积的互补色点缀画面,这样很大的增加了视觉的张力,同时保持了整体的协调。也可以选择调整明度与饱和度来减弱色彩的冲突或者是加入中性色来缓冲。

图片

图片

图片

08

亮暗色对比

亮色和暗色存在较大的差异,暗色的元素可以作为背景,亮色的元素可以设计为主题,能够制造出很强烈的层次感,凸显出视觉的焦点,画面的主体也会很鲜明。亮色和暗色无论是单独使用还是搭配着对比使用都可以很有效的产生对比。利用亮色吸引观者的注意力和眼球,通过暗色来突出亮色,强调设计的重要部分!

图片

图片图片图片

今天的色彩对比设计效果就分享到这里啦,把颜色把控好,注意元素之间的关系,运用明度、饱和度等变化,做出丰富的设计效果。

最后再分享几个配色网站吧!

www.Coolors.com

www.nipponcolors.com

www.uigradients.com

www.kuler.com

www.dribble.com

建议收藏!

- END -

收集整理:设长 杨哥

注:以上图片仅供欣赏,版权归属设计者所有

延展阅读:

图片

图片

图片

图片

做设计的~没灵感?来看看这些配色小技巧

设计师 过来一下 看看这配色!!! 看了还不赶紧收藏~

5招!帮你搞定配色难题!

这6种高级黑配色套路,太绝了!

设计师配色宝典!15个好用到爆的配色网站!(亲测有效)

    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多