色调详解

用户头像
北京/UI设计师/7年前/1946浏览
色调详解
用户头像
U程I

色彩第二篇——色调,从理论到案例,了解平时最常用的色调类型,把握设计的调性。喜欢我文章的小伙伴可以关注公众号“U程I”

书接上回,上一篇我们探讨了为何高级灰会显得高级,从而代入了色彩三要素、色彩的特性,还留下一个关于色调的“关子”,这一篇我们一起来看看色彩的调性带来的情绪以及它们如何影响设计。


色调

色调是将饱和度和明度结合起来阐述颜色的一种表现形式。同一色调的颜色,即使色相不同,给人带来的印象也不会相差很远,所以我们有一种常见的配色方式就是保持饱和度和明度不变,只改变色相。

色彩可分为有色彩和无色彩两种,无色彩基本指的是黑白灰,纯色掺入不同比例的黑、白、灰就会构成不同的色调(纯色是指饱和度为100% 的颜色)。除纯色调、白色调和灰色调之外,白色+纯色为明色调,黑色+纯色为暗色调,灰色+纯色则为浊色调。

掺入无色彩的比例或灰色的明度不同,会衍生出了更多种色调。不同的分法会产生不同数量,下面我将色调分为8种分别介绍:


纯色调

一种亮度中等(50~80)、饱和度高(45~100)的色彩系列。纯色调表示纯净的颜色,艳丽、醒目且充满动感,能表达积极、活泼、健康感的情绪,但同时易花哨、庸俗,一般与其他色调搭配。

undefined


明色调

高明度(50~100)、中等饱和度(30~80),这种色调的颜色显得干净、简洁、有清爽感,易引起用户好感,但视觉效果不突出,易显廉价、平庸感,画面容易不稳定,适合与其他明色搭配。

undefined

淡色调

淡色调的色彩明度高(85~100),但饱和度低,一般在30以下,主要是10~20。色彩具有干净的特性,能显示纯洁感,但无个性,缺乏积极性,有冷淡感。淡色调色彩作为主色时容易不稳定,应与互补色搭配。

undefined


白色调

亮度高于95,饱和度小于5都算白色调,所以有的白色调色彩可能是带有一些颜色的。这种色调朴素、干净,有种文艺、低调感,适合文艺气息、极简风格等。

淡浊色调

淡浊色调介于淡色调和浊色调之间,由少量黑色+淡色或浅灰色+纯色形成。属于低饱和度(5~25)、较高明度(65~80)的色调,色彩有女性的优雅、成熟、柔和感,能凸显品味,女性衣服的轻熟风大致就是这样的色调,但是该色调也包含一点消极感,可用互补色来平衡。

undefined


浊色调

浊色调是一种中等亮度(30~60)、偏低饱和度(20~60)的色调。理论上是由灰色+纯色构成,实际上也可用明色调+黑色得到。该色调的色彩有些浑浊,但同时给人稳重、沉着的感受,比较柔和又不显得沉闷,这种品质感适合高端、文化、复古、奢华主题。不过这种色彩过于内敛,不适合开放、亲切的风格。

undefined


暗色调

暗色调是在纯色上叠加黑色,因此兼具了黑色的神秘感和纯色的力量感。饱和度中等(30~70),亮度低(20~40),比较有男性偏向,带有理性、成熟、威武、严肃甚至恐怖的感觉。适合男性、服装、电子、科技等领域以及高端、商务等主题。

黑色调

饱和度和亮度都很低,大概在0~20之间的可称作黑色调。这些深灰或纯黑充满着力量感、神秘感和厚重感,是一种绝佳的调和色,一般用于高端、奢华、商务、科技、男性使用场景。把黑色调作为背景,即使加上五彩斑斓的图形,也不会显得辣眼睛。

undefined



灰色

除了以上8种色调,还有一种特殊的无色彩——灰色。灰色的范围非常广,亮度一般在20~95,不同的亮度带来的色彩情绪是不一样的。亮度较高的灰色有高贵、安静、性冷淡的感觉,而亮度低的灰色则有严肃、深沉的感觉。

undefined



 

色调实战

知道基础色调后,我们来试试不同色调对设计的整体风格的影响。这里借用一张很好看也很火的还白作为示例,原图如下:

 

我们从配色中可以看出,现在的配色是一种淡浊色调,饱和度和明度都比较低,色相感淡薄,带有几分暗沉,给人含蓄、稳重的感觉,视觉感柔和。

如果换成明色调👇,就显得鲜明、艳丽,比原图要活泼、欢快一些,视觉上要刺眼一点。

 

换成更浅的淡色调,单纯从色调上看显得很轻盈、明快了许多。不过不适合这张海报的主题,缺少了沉重感,更像是青年之间的青涩感情。

 

浊色调(右图)比原图亮度更低,饱和度更高,画面也显得更沉稳。这种色调带有一些复古风,更适合带有年代感的主题。

 

再往深色一点的暗色调就会呈现出一种严肃、正经的氛围,但在这里有些恐怖、阴森感。

 

把图片转换成灰色,会有一些文艺感,但是也会显得很冷淡,难以激起人们的兴趣,不太适合于宣传物。

 

总结

此篇文章详细地介绍了8种色调,运用实例来体验色调给人带来的不同感受。作为设计师,在设计作品的时候非常需要注意根据主题、内容和风格来选择色调,并且能够保持作品内色调的基本统一。




22
阅读原文
|
Report
|
82
Share
评论
用户头像
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
大家都在看
Log in