粉丝485
关注 1
获赞 361
被嘲配色“辣眼睛”?你需要看看这个配色理论!

[教程] 被嘲配色“辣眼睛”?你需要看看这个配色理论!

 !heats_icon! [复制链接]
4112 19 0 58 6年前 举报
教学介绍
配色一直是各位设计师们非常关注的问题,颜色无论是在设计还是生活中都起着至关重要的作用。一张照片甚至可以通过色彩吸引你的视线,唤起特定的情绪或情感。

在一些没有文字的场景中,颜色就显得尤为重要,比如交通信号灯。

a87-1.png

那么我们如何知道哪些配色好看,哪些不好看呢?要知道这个,我们先来学习学习色彩理论。

不局限与艺术家和设计师,任何人都应该了解一点色彩理论,因为它可以帮助你在许多不同的条件下正确使用色彩。

无论是设计抑或是平常的衣着搭配。只需要了解一点色彩理论。无论是在生活还是工作上都会事半功倍。
教学详解
a87-2.png

不知道大家在学校学过主色和辅色没?红黄蓝为主色,橙绿紫为辅色。

a87-3.png

红+黄=橙色,黄+蓝=绿色,蓝+红=紫。如果我们将这些颜色混合在一起,会得到更多色调,如红橙色和黄绿色。

a87-3.gif

所有颜色形成了所谓的色轮。

a87-4.png

以上就是非常基础的色彩理论,接下来我们进一步了解色相、纯度与明度。刚刚学设计的你可能对这些有点陌生,但他们是理解设计理论的关键。
cc6小.jpg
  • 色相(色调)

这是最简单的,我们通常说的“颜色”就是色相。简单说,这台手机是红色的。那么红色就是他的“色调”或者“色相”。

a87-5.png

  • 纯度(饱和度)

饱和度是指颜色的纯度,通俗说就是这个颜色是否鲜艳,是否足够纯。纯度数值越高,画面颜色越鲜艳。反之越灰。

a87-6.png

  • 明度(色值)

明度与颜色的深浅有关,从黑到白,明度指数越高,画面越亮。反之则越暗。

a87-7.png

说了这么多,那到底怎么用这些理论知识学好配色?其实配色也有公式,我相信大家可能也听说过这些方法。首先我们需要一个色轮:

No.1 单色
a87-8.png

这是最简单的配色方法,因为它仅需要一个颜色。

可能有同学会问:“一个颜色咋配??”你忘了我们上面说的明度和纯度的知识了吗?只需要在色轮上挑选一个颜色,调出该明度饱和度不同的状态就行。

a87-9.png
a87-10.png
a87-11.png
a87-12.png
a87-13.png
a87-14.png

作者Behance ID:Andrey Prokopenko

No.2 相似色
相似色是使用色轮中相邻的色彩搭配,比如红色和橙色:

a87-15.png

蓝色和绿色:

a87-16.png
a87-17.png
a87-18.png
a87-19.png


案例采集自网络。

No.3 互补色
互补色是色轮上彼此相对的颜色,例如蓝橙:

a87-20.png

黄绿:

a87-21.png

这里需要注意的是,为了防止颜色过纯导致辣眼睛的情况,最好在运用互补色的时候调整一下颜色的纯度与明度。

互补色配色对比效果极好。想增加作品视觉冲击不妨试试这个方法。

a87-22.png
a87-23.png
a87-24.png
a87-25.png

No.4 三元配色
三元配色在色轮上形成一个完美的等边三角形,这些颜色的组合效果可能会让你意想不到,特别是主色和辅色的搭配运用。

a87-26-2.png
a87-26.png

No.5 四元配色
字面意思,四元配色在色轮上形成一个矩形。在配色时可以选一个颜色为主色其它颜色辅助。

a87-27.png

说了配色方法,那么在配色时有哪些注意事项呢?

  • 饱和度过高

你是否有这种经验,配色非常扎(la)眼?祭出这张图哈哈哈

a87-28.png a87-29.gif

这时候你可以尝试选择一种颜色并且调整它的亮度、暗度或者饱和度。


这样看是不是好多了?

  • 可读性过低

可读性是任何设计的必备要素,你的配色应该使文本清晰易读。

a87-30-1.png
a87-30.png

这两个网页哪个你愿意往下继续看?答案显而易见!使用对的颜色能够使你的信息脱颖而出!

  • 颜色氛围

每种颜色给人的感觉都不同,例如,明亮的色调往往能够带来有趣或者现代感的氛围。

低饱和度的色彩搭配往往会受到商业公司的喜爱。

a87-31.png

所以当你着手项目时应该考虑到你的设计要给观众传达什么样的感觉,然后确定项目配色。

不用害怕配色!生活中很多广告、海报、电影甚至于服装搭配,很多方法可以让你学习配色!只要记住这些色彩理论,至少做到配色不辣眼是完全没问题的!

有条件的同学可以看本次文章主题的视频版:
来源:优秀网页设计

0
点赞
0
打赏
58
添加到收藏夹

0

点击复制链接

使用微信扫码分享
一次扣10个券
全部评论19
您需要登录后才可以回帖 登录 | 立即注册

有点厉害 哦!
5年前
回复

使用道具 举报

谢谢楼主分享
5年前
回复

使用道具 举报

l
5年前
回复

使用道具 举报

资源甚好,且阅且珍惜!
5年前
回复

使用道具 举报

真不错的网站,谢谢分享。
5年前
回复

使用道具 举报

谢谢分享
6年前
回复

使用道具 举报

厉害了我的哥!
6年前
回复

使用道具 举报

很暖心的色彩理论教程,必须收藏
6年前
回复

使用道具 举报

谢谢楼主分享~
6年前
回复

使用道具 举报

数据加载中....
没有更多评论了