首页 > 网页教程 > 设计分享 > 三分钟帮你快速入门极简色彩学

三分钟帮你快速入门极简色彩学

时间:2015-11-17    来源:产品100

色彩

相信很多不懂配色星人(尤其是汉子们),收到女朋友的<秘密花园>涂色指令时内心是奔溃的。

“到底要肿么配色啊……”(╯‵□′)╯︵┴─┴

“辛辛苦苦涂了半天还是土得掉渣肿么破……”(╯‵□′)╯︵┴─┴

那就来看一下我们的极简色彩学教程吧~

必GET点1.色彩的组成

关键词:原色 间色 复色 色环

1

所有的色彩都是源自红黄蓝三种“原色”。

极简配色

两两混合后得到三个二级色即“间色”绿橙紫。

极简配色

原色与间色混合或间色与间色混合而形成越来越多的颜色,称之“复色”。

极简配色

最后由三种原色、三种间色和六种复色组成的系统就统称为十二色环(colorwheel),也是学习色彩搭配的基础。

必GET点2.色彩的搭配

关键词:单色 近似色 补色

十二色环的存在并不只是一个摆设,它巧妙地建立了配色系统。

常见的色彩搭配有:单色搭配,近似色搭配,补色搭配,分散互补色搭配,三角对立的配色搭配……

1、单色搭配(monochromatic)

极简配色

这个不用解释,就是只用一种颜色的搭配。

2、补色搭配(complementary colors)

极简配色

色环上相对的两种颜色,被称为互补色。放在一起,会形成对比效果。比如蓝色和橙色、红色和绿色、黄色和紫色等。

互补色有非常强烈的对比度,在颜色饱和度很高的情况下,可以创建很多十分震撼的视觉效果。但是记得,在文本中使用互补色是很糟糕的

极简配色

让-皮埃尔·热内的导演作品《天使爱美丽》中的色板,是一个典型的红色和绿色互补色。

3、分散互补色搭配(split-complementary colors)

8

如果要寻找三种颜色,其中二种互相类似,另一种与它们形成对比,则可以选取互补色两侧相邻的颜色。分散互补色搭配是初学者很好的选择,怎么搭都很好看。

10

红、深蓝与浅蓝搭配,完美突出对比感而画面却十分和谐好看。

4、类似色搭配(analogous colors)

11

色环上任意三个相邻的颜色,被称为类似色。通常认为,它们放在一起会很和谐。

12

类似色是选择相近颜色时十分不错的方法,可以在同一个色调中制造丰富的质感和层次。

5、三角对立配色(Triadic colors)

13

此外,如果要寻找三种互相平衡的颜色,可以选择12色的Color Wheel上任意三个三角对立的颜色(Triad)。

14

要成功地使用三色系产生和谐效果,需要谨慎地在色彩间取得平衡——只用一种主色,其他两种颜色作烘托

必GET点3、调色三要素

关键词:色相 饱和度 明度

要精准的调出每一种颜色,包括了三要素:色相、饱和度和明度。

14

色相(hue):指饱和度和亮度都为100%的颜色。我们肉眼所见到于是能说出来的颜色就叫色相,所有的色相都可以用色环来展示。

15

饱和度(saturation)即纯度,指色彩的鲜艳程度——颜色中含有灰色的程度。

饱和度越高,颜色越纯,色彩越鲜明;饱和度越低,颜色中灰色成分越大,色彩越黯淡。

16

明度(value),即色彩的亮度,明度反映的是色彩的深浅变化,如粉红、大红、深红,都是红,但一种比一种深。

明度的变化来自于颜色中白色的成分变化。一般情况下在颜色中加入白色,明度提高,加入黑色,明度降低。最大值时,所有颜色都变成白色,最小值时,所有颜色都变成黑色。

下面来看一下明度(Value)的具体应用。

TINT:HUE+WHITE

17

在色彩中加入白色。这种基调给人更加明亮、和平但缺少活力的感觉,更体现女性色彩,适用的行业有spa、美容等。

18

19

SHADE:HUE+BLACK

20

在色彩中加入黑色。神秘、黑暗、罪恶、危险色调,更体现男性色彩。使用纯色或更明亮的阴影色时,与渐变能很好搭配。

21

22

TONE:HUE+GREY

23

在色彩中加入灰色,调性不至于太黑暗但能突出冰冷的感觉。

24

最后推荐两本色彩方面很好用的书:

一本是日本的视觉设计研究所的《七日掌握设计配色基础》,他们出的一系列书都很好。这本书目前实体书已经绝版了。

还有一本是《红色范思哲 灰色阿玛尼》。这本书是从服装色彩搭配来讲的,因为是身边的事情,所以特别好理解。

好了,现在扫视一下身边你觉得好看的东西,再看看它的配色,是不是整个感觉都不一样了呢?

相关推荐
30个出色的网页设计色彩搭配案例欣赏
网页配色之色彩搭配技巧与色彩对用户的心理作用
网页色彩搭配教程:三个实用方法搞定网页配色设计
色彩搭配教程:颜色对用户究竟有哪些影响?
网页配色经验分享:叠柔配色技巧及图解分析
深入探讨图片格式与网页设计的那点事儿
色调心理效应 颜色在网页设计中的重要性分析
网页设计新趋势:撞色风(Color Blocking)风格的网站欣赏
创造视觉冲击力的网页设计配色技巧
色彩情感对用户体验设计的影响
网页配色教程:Thinkful网站配色完全学习指南
10个实用方法帮你搞定网页柔和色调设计
2015年网页设计配色趋势预测
QQ空间配色变迁解密:“杀集取卵”!
网页配色教程:六条网页设计安全配色指南
30个幽默有趣的404错误页面创意设计欣赏
分享:网页核心内容对视觉表现的影响
网页设计的背景创意风格与设计趋势分享
20+艺术视觉和网页完美统一的网页创意案例欣赏
21个带斜线排版设计的网站设计创意欣赏
55个极具创意的手绘网页设计案例欣赏
从优秀案例分析网页Banner视觉构成与创意设计
15个运用创意印刷字体的网站欣赏
产品设计:万水千山总是情 不要图片行不行
15个最佳创意型404错误页面案例赏析
15个国内外优质设计分享平台推荐 设计师必收藏
网页设计怎么破?创新式布局与交互的设计
12个启发灵感的创意单页网站作品欣赏
8个即将过时的网页设计趋势剖析
21个优秀的国外电子商务网站赏析
22款“暗黑系”的网页设计案例欣赏
四大网页设计秘诀:让用户第一眼就爱上你的网站
构图之美:成功的专题都是怎么构图的?
38个创意出彩的网页字体设计案例赏析
9个国外杰出创意网站精选案例欣赏

分类导航

教程推荐

热门特效

热门教程