万字干货!6大章节帮你从零开始系统学配色

Date 2025-10-30 21:08:07

万字干货!6大章节帮你从零开始系统学配色

推荐阅读

 

 

一、前言

在我们通常的设计工作中,颜色是工作中不可或缺的元素。我们通常通过目标产品、人群、年龄来使用颜色来匹配合适的颜色,那么我们不知道什么,让我们一起理解吧!

第二,重新认识周围的颜色

首先,我们系统地了解颜色的基本知识。颜色是人脑识别反射光的强度和不同光波的感觉,光波是一种电磁波,类似于医院检查身体 X 光,我们把我们每天看到的光称为可见光。从目前的物理角度来看,颜色是通过眼睛、大脑和我们的生活经验产生的光的视觉感觉,是人类视觉器官在所见光环境中产生的视觉神经的感觉。

那么,我们的大脑和眼睛是如何区分各种颜色的呢?我们的眼睛由三种视锥细胞组成,它们的主要功能是分析和反馈和传递我们通常接受的光波长,这相当于翻译人员的工作。我们的眼睛对波长翻译的三种视锥细胞对应可见光范围内的长波、中波和短波。在光谱中,长波对应红色,中波对应绿色,短波对应蓝色。这三种颜色构成了我们在识别物体时最基本的三种颜色。

其次,三原色分为两种,一种是艺术三原色,另一种是色光三原色,艺术三原色是指青色(cyan)、品红色(magenta)、黄色(yellow),颜料越混合,颜色越深,直到黑色;色光三原色为红色(red)、绿色(green)、蓝色(blue),颜色越混合,直到白色才会越亮。这就是为什么我们生活中的电灯通常是白色的,因为白色包含更多的颜色,并通过它反映更多的颜色信息。

为什么艺术三原色和色光三原色的颜色不同,两者是如何确定的?

我们如何理解这两种三原色的区别?本质上,我们能看到的物体是因为光进入人眼。光是电磁波,人眼只能感知到 400nm 至 700nm 范围内的电磁波。这部分电磁波谱也被称为可见光谱。

万字干货!6大章节帮你从零开始系统学配色

当可见光进入我们眼睛的视网膜时,视锥细胞会被激活并向大脑传播信息。人类视网膜上有三种视锥细胞(S M L)。

万字干货!6大章节帮你从零开始系统学配色

这三种视锥细胞对应可见光范围内的长波、中波和短波。在光谱中,长波对应红色,中波对应绿色,短波对应蓝色。因此,我们能看到的颜色实际上是生物概念,而不是物理概念。像鸟一样,它们是四种视锥细胞。除了红色、绿色和蓝色,他们还可以看到人类看不到的紫外线。

万字干货!6大章节帮你从零开始系统学配色

早在 17 世纪,年仅 23 一岁的物理学家牛顿发现,经过三棱镜的折射,由于每种基本颜色的光波长度不同,当白光通过三棱镜时,根据波长排列,这种光散射成不同的颜色,这就是著名的色散现象。

万字干货!6大章节帮你从零开始系统学配色

当时,人类开始在彩色光中寻找原始颜色。所谓的原始颜色是指与其他颜色无法获得的“基本颜色”。牛顿率先将自然光分为七种单色光。我们现在知道彩虹由红色、橙色、黄色、绿色、蓝色和紫色七种颜色组成。但从科学的角度来看,我们不能说彩虹是七种颜色,但它实际上是一个连续的光谱。这就是为什么当我们看到彩虹时,我们总是不能正确地计算颜色。

事 事实上,一开始,牛顿就把这个光谱分成了这个光谱。 11 各种颜色。但是他很快就把它们放在一边了。 11 改成了 据说是因为 7 炼金术中的颜色对应于炼金术 7 个音阶,7 种金属,7 一步一步。因此,这一决定更加得心应手。

万字干货!6大章节帮你从零开始系统学配色

之后,经过多次实验,牛顿也发现了一个重要的规律。当红色、绿色和蓝色混合时,你可以得到白光。此时,牛顿得出结论,白光是由不同颜色的光混合而成。这一发现为光学和色彩研究奠定了经典力学时代的理论基础。

1. 发现三原色

牛顿是物理学家 1643-1727 2000年,在发现了七种颜色的光后,我们开始推断,既然白光可以分解和合成,那么这七种颜色的光也可以分解和合成吗?经过一段时间的实验,牛顿计算出,只有红色、绿色和蓝色不能分解和合成。其他四种颜色可以以不同的比例组合。所以红色、绿色和蓝色被称为“三种原色”。但这只是他的推断,并没有得到实验的证明。

托马斯杨一个世纪后 1773 年至 1829 多年来也有了新的发现。托马斯杨首先测量了七种光的波长,并建立了三种原始颜色更完美的原则。所以他建议颜色依赖于眼睛里的三种不同的神经,它们对红色、绿色和蓝色最敏感。所有的颜色都可以与红色、绿色和蓝色的比例混合。这一原则已成为现代色彩研究的理论基础。

从 1777 年到 1851 丹麦物理学家奥斯特比托马斯杨小四岁,在那里 1820 在托马斯杨晚年发现电流的磁效应的基础上,英国物理学家法拉第扭转了他的想法,最终在 1831 2000年发明了人类历史上的第一台圆盘发电机。后来,随着大量玩电科学家的出现,电气设备得到了大规模的改进和使用。灯泡和发光二极管相继发明,人类学会了用电来创造光。

在学会了如何用电来制造光之后,人类根据前人的光学和颜色研究结果制造了红色、绿色和蓝色的光源。通过调整不同光量的比例,可以调制成千上万种颜色。随着单色光源的尺寸越来越小,无数 RGB 组合依次排列,水平和垂直布置,封装在一个面板上,有我们今天看到的电子显示器。

二、什么是颜色模型

我们看到的图像数据以二维形式表示。 这些照片包括色彩鲜艳、表现力丰富的彩色照片,以及沮丧的黑白风格。 有些照片只有纯黑色和纯白色。 所有这些都是不同形式的图像,然后我们将通过不同的颜色模型来理解它们之间的差异。

1. RGB颜色模型

RGB 颜色模型应该是我们日常生活中接触最多的颜色模型,这也是由我们人眼所能辨别的不同颜色值组成的。RGB 颜色模型是红色、绿色和蓝色 3 根据不同的亮度比混合不同的颜色,以显示不同的颜色。因为它被用于实现 3 颜色的定量比例,因此该模型也被称为颜色混合模型。通过 3 混合叠加最基本的颜色来显示任何颜色的方法现在主要用于主动发光的显示设备,如显示器。

万字干货!6大章节帮你从零开始系统学配色

2. CMYK颜色模型

假如三原色调色的使用是人类发明的,那么 CMYK 四色印刷的原理和应用只能被视为发现。在公元之前,聪明的古埃及人和中国人已经知道如何从自然环境中收集颜料了。然而,由于缺乏理论知识和技术瓶颈,可调制的颜色非常有限。随着人类文明的不断发展,人们从自然中发现了更多的奥秘,并逐渐学会了用更少的颜料制作更多的颜色。到目前为止,在平面设计领域有一种四色印刷模式。

也就是说,颜料和黑墨水的混色原理可以混合叠加四种颜色,我们看到的大部分颜色都可以混合调制。

四色印刷模式(CMYK)它是彩色印刷中使用的一种颜色模式。采用三原色混色原理和黑色油墨,共混合叠加四种颜色,形成所谓的“全彩印刷”。四种标准颜色为:

C:Cyan= 蓝色常被误称为“天蓝色”或“蓝色”

M:Magenta= 洋红,又称“品红”

Y:Yellow= 黄色

K:blacK= 黑色(最后一个字母在这里缩写) K 而非开头的 B,这是因为在整体色彩学中 B 给了 RGB 的 Blue 蓝色)

颜料的混合是减色混合,混合在一起的颜料越多,颜色就会变得浑浊和暗淡。CMYK 四色模式是工业印刷的产物。CMY 三色混合物不能像艺术三原色(红色、黄色、蓝色)那样得到纯黑色,因此有必要添加额外的黑色墨水来使颜色变暗。此外,灰色和黑色在工业印刷过程中非常常见,CMYK 四色印刷可以调制出比艺术三原色更丰富、更精细的颜色(即更宽的色域)。因此,使用 CMYK 毫无疑问,四色印刷模式,CMYK 四色印刷已成为印刷行业的标准。

下图为 CMY 叠色示意图

万字干货!6大章节帮你从零开始系统学配色

3. HSV / HSB 颜色模型

HSV 颜色模型可能不是特别熟悉,这是一种颜色(H)、饱和度或纯度(S)、明度或亮度(V)3 一种表示颜色的参数方式。S 它指的是颜色的纯度,这个截面也是设计软件中的拾色器。

① 色调(Hue)

以角度的形式测量,取值角度的范围为[0,360]。红、绿、蓝 3 逆时针排列种类颜色。例如,红色的位置是 0°,绿色为 120°,蓝色的位置是 240°。例如,我们所说的蓝色、绿色和紫色是不同的颜色。为了方便我们对颜色的表达和研究,我们将光谱中可见光的颜色序列连接起来,形成一个 360°色相环,每一度都表示一种颜色。

② 饱和度(Saturation)

饱和度反映了颜色和光谱颜色之间的接近程度。某种颜色是光谱颜色和白光混合的结果。如果某种颜色中的白色成分较少,则颜色更接近光谱颜色,显示颜色较暗、明亮的效果,此时饱和度较高。相反,对于低饱和度的颜色,它含有的白色成分越多,它的颜色就越倾向于白色,亮度就会下降。

例如,当我们还是个孩子的时候,我们的房间里会贴满明星海报。几个月后,原来鲜艳的海报颜色会慢慢褪色。当我们看到这种情况时,我们作为设计师的气质本能地说:海报的颜色饱和度比以前低了很多。当纸张饱和度为零时,即纸张的本质颜色。

也就是说,饱和度反映了某种颜色中的白色成分,可以使用 0 ~ 100%表示。值越高,饱和度越高,光谱颜色的成分越多。

③ 明度(Value)

亮度显示了某种颜色的亮度,可以称为光强产生的视觉体验。我们看到的颜色越亮,亮度值越高,反之亦然。比如深紫色和粉色,深紫色更暗,粉色更亮,所以粉色的亮度比深紫色高。同样,我们也可以用百分比的形式来表示某种颜色的亮度。

例如,房间里的灯是 10w 和另一个房间的灯是什么? 50w的亮度也大不相同。在我们常用的设计软件中,亮度的值也是如此 0~100,为 0 时间是纯黑色,为 100 时间是最亮的。

万字干货!6大章节帮你从零开始系统学配色

三、颜色模型的应用场景

① RGB 颜色模型应用场景

在我们平时的设计工作中,我们更多地使用它 RGB 它是我们设计印刷品时最常见的颜色模型 CMYK 色彩模型,其次,有些设计使用较少 Lab 模型和 Hab 模型。

我们现在使用的电视屏幕或电脑显示器上的各种颜色都是由 RGB 根据不同的比例,它们的一组红、绿、蓝是这些像素的组成点,这也是很多人每天都喜欢比较哪个品牌的手机像素。

但他们可能不太清楚像素好是什么意思。好像素意味着你有很多像素点。每种颜色图案都由许多点组成。这些点是一组 RGB,像素越多,颜色越亮,图像越清晰。电脑上的亮度是指 RGB 多少,而且都是整数,RGB 一般是有 256 个亮度。

从 0 开始到 255,都是亮度,三种颜色有三种 256 亮度,其中之一 0 在我们的生活中,我们不想忽视它。这也是一个亮度。每种基本颜色都有 256 因此,它们的组合颜色数是 256 三次方,大约是 1678 一万种颜色,所以我们通常称之为千万种颜色。有时也被称为 24 位色,是指 2 的 24 第二,它们存在的越多,我们看到的世界的颜色就越真实。例如,电脑上白色的组成是 255.255.255,相对黑色是 0.0.0 这是计算机上的颜色值代码。

那么对应的 RGB 数值就是,R 红色为 255.0.0,G 绿色为 0.255.0,B 蓝色的为 0.0.255是我们根据这三种基色的不同组合看到的各种颜色所学到的 PS 人们通常熟悉这种模式,使用许多图片处理工具 RGB 模式。

一般的应用是我们的显示器、投影仪、扫描仪、数码相机,其中一些用于数码相机 CMYK 拍照的模式,但就像我们的显示器一样,最早的电视是黑白的,逐渐改变 RGB 该模式用于计算机上的显示器 RGB 模式。

万字干货!6大章节帮你从零开始系统学配色

一般来说,当你的电脑画面不流畅时,通常是 RGB 基点少,图形卡不足以满足所需的基点,游戏中的图像质量取决于基点,浓度越高,图像质量越好,反之,图像不流畅,RGB 模型在我们的生活中起着很大的作用,但它通常用于显示设备,因为它是发光的。

万字干货!6大章节帮你从零开始系统学配色

②  CMYK 颜色模型应用场景

CMYK 由于印刷行业的发展,颜色模型是一种颜色模型 CMYK 的颜色比 RGB 颜色范围较小,打印图像时无法打印 RGB 此时需要模式图像 RGB 更改模式下的图像 CMYK 模式。如果将 RGB 转换模式下的图像时,可能会出现颜色损失或偏差。

一般来说,模式的转换是根据需要来确定的,RGB 模式比 CMYK 模式的颜色更丰富,颜色更鲜艳,转化为 CMYK 模式结束后,颜色会变暗,但如果要打印,必须使用 CMYK 模式。RGB 如果要转换模式图 CMYK 模式图,先通过 Lab 将模式转换为 CMYK 它介于模式 RGB 和 CMYK 之间的模式。但即便如此,转换后颜色还是会变。

万字干货!6大章节帮你从零开始系统学配色

③ HSV/HSB 颜色模型应用场景

它是基于颜色的直观特征 A.R.Smith 于 1978 一种年度创建的色彩模型。由于 S 它指的是颜色的纯度,也是设计软件中的拾色器。因此,我们在大多数设计软件中使用的拾色器也是由它完成的。

万字干货!6大章节帮你从零开始系统学配色

1. 色彩应用-信息传递

色彩传递信息是人们几千年来文明演变形成的共识的结果。比如早在先秦时期,就产生了以服色区分贵贱的观念,但只能区分贵族与奴隶之间的界限,不能严格区分天子、贵族、清朝皇室之间的差异。隋唐以后,等级制度开始高度强化,你的颜色形成了严格的等级序列。

在唐代,五品以上的官员可以穿紫色的衣服,然后没有官员。他们可以穿全黑的,有时是浅红色的,然后七品官是绿色的。在宋代,普通人只允许穿白色的衣服。明朝的人应该避免黑色、紫色、绿色、柳黄和明黄。这就是我们所知道的色彩服装体系。

到目前为止,虽然颜色没有那么麻烦的规则,但也有很多共识,比如常用的危险红色、安全通行的绿色和警告的黄色。如果我们用绿色设计警告标志,肯定会给日常生活带来很多麻烦。因此,当我们设计一些特定的颜色时,我们实际上有一个应该使用的场景。

万字干货!6大章节帮你从零开始系统学配色

2. 色彩运用-情感传递

自古以来,中国就擅长用颜色传达情感。例如,“我最喜欢的湖东行不足,绿杨阴白沙堤”。我相信每个人都学会了诗人白居易的钱塘湖春游。绿杨阴白沙堤很容易让我们想起柳树的叶子。通过这一系列的描述,很容易体会到诗人对钱塘江的热爱。

除此之外,我们还可以通过颜色的色调来传达情感。例如,当我们遇到悲伤的事情时,我们通常会选择黑色或灰色作为朋友圈的图片来暗示我们的心情不好。此外,这种无色也能传达一种压迫感或紧张感。例如,我们以前学过的诗“黑云压城欲毁”,用一句话来描述当时战争的紧迫感,所以色彩也能传达情感颜色的属性之一。

万字干货!6大章节帮你从零开始系统学配色

彩色可以传达更多的信息,比如饱和度高的彩色图片可以传达喜欢快乐或青春的感觉。所以,能让我开心剁手的双十一或者双十二,用的颜色会更鲜艳。

万字干货!6大章节帮你从零开始系统学配色

3. 色彩运用-品牌传递

色彩体系也是品牌传播中极其重要的一部分。比如我们走在街上,看到这种颜色的麦当劳你还敢吃吗?

万字干货!6大章节帮你从零开始系统学配色

所以颜色是一种沉默的语言,它让品牌带来的记忆点绝对高于图形,所以现在互联网企业也开始慢慢关注自己的品牌颜色标准和 UI 延伸应用于设计。

四、色彩三要素

当我们描述一种颜色时,我们通常可以用深红色、浅蓝色、深绿色或明黄色的名字来描述。虽然我们也可以在一定程度上交流颜色信息,但这还不够严格和科学。在颜色管理中,只有建立颜色系统,才能有统一的颜色共同语言,才能准确地交流颜色信息。常用的颜色系统包括:

美国孟塞尔的颜色系统(Munsell color system)德国的 DIN 色彩体系瑞典自然色彩体系(Natural Colour System)奥斯特瓦尔德色彩体系(Ostwald Colour Order System)中国色彩体系

1905 年, 孟塞尔(Albert H. Munsell)开发了第一个被广泛接受的颜色顺序系统(color order system),它被称为孟塞尔色系统(Munsell color system),准确描述颜色。孟塞尔色空间描述的所有颜色集合都被称为孟塞尔色立体(Munsell color solid),孟塞尔色立体就像一个扭曲的偏心球。

科学、系统、清晰地透过孟塞尔的色彩体系(value)、色相(hue)及纯度(chroma)用三个维度来描述颜色的方法,这三个概念今天也被称为颜色的三个元素。

万字干货!6大章节帮你从零开始系统学配色

1. 色调的构成

我们一直在谈论颜色和颜色。什么是颜色和颜色?

① 色调:决定色调的是反射光中哪种光具有优势。一幅画的色调通常从四个方面定义:色调、亮度、冷暖和纯度。

注:色调不是指色彩的性质,而是对一副作品的整体评价总结,是作品色彩的倾向。

虽然一幅画有很多颜色,但总的来说有一种倾向,那就是蓝色 or 偏红,偏冷 or 偏暖,倾向是色调。

万字干货!6大章节帮你从零开始系统学配色

② 色彩:从色调中抽象出来的感觉,或者理解为一幅画的感觉。

2. 色调-明度基调

由于颜色之间的亮度不同,形成的对比关系称为明度对比。因此,可以形成相同颜色相、不同亮度和不同颜色相的明度对比。在色彩对比中,明度对比是最能表达色彩层次感、空间感、清晰感、重量感和软硬感的对比关系。

我们将明度色标分为 9 度。1 度—3 称为低调色,4 度—6 称为中调色,7 度——9 它被称为高调的颜色。高调的颜色显得活泼、可爱、柔软、明亮、轻盈。低调的颜色是简单、丰富、迟钝、沉重、宏大、孤独的感觉。

在色调的明度对比中,明度对比的强度取决于颜色之间的明度差。亮度差越大,对比度越强,亮度差越小,对比度越弱。

以无色调划分 9 等级明度等级为基本标准,明度差强弱可分为以下几类:

短调对比(弱对比):明度差别在 3 等级以内。中调对比(中对比):明度差别在 3-5 等级内。长调对比(强对比):明度差别在 5 级以上。

① 色调-明度色调-高调

在设计作品中,一般采用高调的作品会有明亮、柔软、纯净等特点。一般来说,人们会想到更好的东西,比如明亮的天空、鲜花盛开的郊游场景等等。这类设计作品通常是大面积的高调色彩 70%-85%,再配以小面积低调色,使作品一般层次分明,对比较强。

万字干货!6大章节帮你从零开始系统学配色

② 色调-明度色调-中调-中调

中调作品一般给人一种平静的感觉,不会让人有特殊的情绪波动,也不会有人特别喜欢或讨厌。

万字干货!6大章节帮你从零开始系统学配色

③ 色调-明度色调-低调-低调

低调作品给人的联想词一般都是厚重、沉闷、阴沉、迟钝。我见过更多的黑金搭配。

万字干货!6大章节帮你从零开始系统学配色

3. 色调-明度对比

① 色调-明度对比-长对比

长调对比(强对比):明度差别在 5 级以上。

万字干货!6大章节帮你从零开始系统学配色

长对比作品形成强烈的明暗对比。对比度大,视觉效果强,对比度强,清晰度高,爆发力强。

万字干货!6大章节帮你从零开始系统学配色

② 色调-明度对比-中对比

对比色调明度对比 5 以内,3 以上称为对比。

万字干货!6大章节帮你从零开始系统学配色

整体效果是中调的弱对比。具有模糊、朦胧、含蓄、朴素、平板、梦幻般的效果。

万字干货!6大章节帮你从零开始系统学配色

③ 色调-明度对比-短对比

色调明度对比中的色阶跨度 3 阶下称为短对比。

万字干货!6大章节帮你从零开始系统学配色

短对比作品一般具有庄重、含蓄、朦胧的效果。

“万字干货!六章帮你从零开始系统学配色。”

4. 色调-冷暖对比

由于颜色和颜色的不同而形成的颜色对比称为冷暖对比。色彩的冷暖感是由于长期生活实践中的联想而形成的。红色、橙色和黄色经常让人想起东方的太阳和燃烧的火焰,所以他们有一种温暖的感觉。蓝色经常让人想起蓝天和阴影中的冰雪,所以它有一种寒冷的感觉。因此,它被称为“冷色”。事实上,绿色和紫色给人一种不冷不暖的感觉,因此被称为“中性色”。

万字干货!6大章节帮你从零开始系统学配色

一般来说,冷色的颜色,包括黑色、灰色、茄子蓝、深棕色、深绿色、紫色等,在视觉上有收缩作用。

万字干货!6大章节帮你从零开始系统学配色

所以一般黑色的裤子会比亮色的裤子看起来更瘦,这也是通过科学的原则让自己看起来更瘦。

万字干货!6大章节帮你从零开始系统学配色

① 色调-冷暖对比-暖色

由于人们的生活习惯和接触事物的感觉,红色、橙色和黄色通常被称为暖色。

万字干货!6大章节帮你从零开始系统学配色

红色也是极其温暖的颜色,其次,红色本身代表着更多的意义。给人的联想词基本上是活泼、快乐、温暖等。

万字干货!6大章节帮你从零开始系统学配色

② 色调-冷暖对比-冷色调-冷色调

由于人们的生活习惯和接触事物的感觉,一般的冷色主要是蓝色和蓝色。

万字干货!6大章节帮你从零开始系统学配色

在冷色调中,蓝色是极其温暖的色调。一般来说,夏天的衣服主要是冷色,这是一种心理补偿。

万字干货!6大章节帮你从零开始系统学配色

③ 色调-冷暖对比-中性色调

说到中性色,大多数人的第一反应是指黑色、白色和灰色。但现在中性色的定义更为广泛,包括紫色和绿色,这是一个明显的冷暖色系列。

万字干货!6大章节帮你从零开始系统学配色

中性色的使用应灵活,不受一些固定搭配的限制。它可以广泛应用于设计作品中,作为设计的主色调,不会显得突兀或沉闷。辅以其他颜色,可以营造出平静、温柔、高档的质感。

万字干货!6大章节帮你从零开始系统学配色

④ 色调-冷暖对比-相对冷暖

暖色也有冷暖之分。我们称之为相对冷暖,也就是说,如果有对比,就会有差异。饱和度越高,看起来就越暖和。

万字干货!6大章节帮你从零开始系统学配色

我们可以得出结论,越暗饱和度越低,相对冷暖越冷。

万字干货!6大章节帮你从零开始系统学配色

5. 色调-纯度

颜色的纯度。从左到右,纯度从高到低。纯度越高,颜色越正确,就越容易区分。同一种颜色含有的灰色成分越多,纯度就越低,这通常被称为“脏”。

万字干货!6大章节帮你从零开始系统学配色

此外,我们还将对纯度进行分类,一般分为:无彩度、低彩度、中彩度、高彩度。

万字干货!6大章节帮你从零开始系统学配色

① 色调-纯度-低色度

低色度的作品一般都是简单优雅的设计作品,有的看起来很高级,一般给人的联想词似乎没有太大的情绪波动。

万字干货!6大章节帮你从零开始系统学配色

② 色调-纯度-中彩度

中彩度的设计一般会给人更舒适、向往美、青春、活泼的视觉效果。

万字干货!6大章节帮你从零开始系统学配色

③ 色调-纯度-高色度

高色度是一种视觉体验,明显高于前两种体验,一般给人力量、对比度强、清晰度高、积极的视觉体验。

万字干货!6大章节帮你从零开始系统学配色

五、色彩联想

色彩的直接心理效应来自于色彩的物体理光刺激直接影响人的生理,颜色直接影响生理。所有信息都会使用联想效应,不同场景下的情绪反射也会有所不同。

联想效应(Associative Effects)又称逻辑误推效应,是指联想是一个从一件事到另一件事的心理过程。色彩联想分为特定的联想和抽象的联想。具体的联想是从颜色到特定的事物,如红色、太阳、火焰、红旗等;抽象的联想是从颜色到某种抽象的概念,如温暖、危机、节日等。(看到颜色联想到特定的事物,看到颜色联想到抽象的概念,只是一种感觉,而不是一个物体)例如,当你饿的时候,你肯定想吃这样一道菜。

万字干货!6大章节帮你从零开始系统学配色

还是这道菜。你还是饿了。如果你把它炒成这种颜色,拿出来给你,你肯定不想吃。你甚至会怀疑这道菜有毒,因为这种颜色在我们的现实生活中很少是美味的,它不符合我们对食物的色彩联想。

万字干货!6大章节帮你从零开始系统学配色

例如,我们生活中的许多设计也采用了色彩联想的方式,我们会觉得他们融入我们的生活没有问题,例如,在形状和颜色上联想最接近的对象...熊。

万字干货!6大章节帮你从零开始系统学配色

例如,穿红色衣服的教练可能会给我们一种更热情的感觉。这些都是我们自己对颜色的联想。

万字干货!6大章节帮你从零开始系统学配色

因此,当我们面对不同的颜色时,它会给人们带来不同的感觉。面对不同的颜色,人们会有不同的心理反应,如温度、明暗、重量、强度、距离、膨胀、速度等。这些都是色彩背后的一些含义/属性/联想带给我们的感受。

1. 色彩属性 / 印象坐标

我们对每种颜色的固有印象已经形成,那么我们如何划分每种颜色的属性或印象呢?在这里,我们需要使用一个坐标,根据分类划分我们对颜色的共识,以便总结和分类,我们可以在实际工作中使用它。

万字干货!6大章节帮你从零开始系统学配色

我们也可以将其转换为每种颜色所代表的一般属性。

万字干货!6大章节帮你从零开始系统学配色

其次,世界被每个行业所采用 LOGO 色彩归类。

万字干货!6大章节帮你从零开始系统学配色

2. 色彩的心灵映射和应用

① 黑色

黑色是与人类关系最密切的颜色之一。在原始社会中,夜晚和死亡对人类来说是最神秘的。许多国家在葬礼上穿黑色衣服向死者表示哀悼,这是原始遗产。耶稣基督于周五去世,现在许多中国基督徒相信基督教,所以“黑色星期五”在中国传播开来。

在现代社会,黑色的不吉利因素正在慢慢消失,被人们所接受,这意味着现在会有更多的人购买黑色汽车,许多高端品牌的设计开始突出黑色的质量。

夜和煤的颜色是黑色的,浓郁的风格也是黑色的。20 世纪 60 在20世纪90年代,美国一所重要的文学学校被称为“黑色幽默”,因此黑色也是力量和勇气的象征。它具有男性毅力、力量和严肃性的特点,在产品中的应用可以突出产品的质量。

黑色作为一种无色,与其它颜色搭配会使其它颜色看起来更亮。

万字干货!6大章节帮你从零开始系统学配色

② 白色

白色是所有颜色光的混合物,也被称为全色光。它是阳光的颜色,白天的颜色。因为白色反映了色光和热能,夏天穿白色或浅色的衣服可以让人感到放松和舒适。

其次,在基督教中,白色可以使人纯洁、神圣、明亮。在欧洲和美国的所有婚礼上,新娘通常穿着白色的婚纱,这是神圣和幸福的象征。然而,中国的传统习俗与西方不同。白色是丧葬、白孝、花、白领带的颜色,白色代表死者的记忆。但也有失败者的无用和象征,因为中国有句老话叫“穷两白”。

白色可以搭配各种颜色。在暗淡的颜色中加入白色会立刻变得明亮。

万字干货!6大章节帮你从零开始系统学配色

③ 灰色

灰色是介于白色和黑色之间的中性颜色,具有知识分子的味道。不同的是,灰色给人一种简单、平静和孤独的感觉。在设计上,灰色通常被用作视觉过渡区和休息区。

在我们的现实生活中,多云的天空、城市道路和水泥路都是灰色的。因此,灰色是设计中大部分时间的背景色。

灰色是保证色彩和谐的重要配角。没有配角的大力配合,主角也没有那么出彩。在 UI 在设计中,灰色通常作为未选择的颜色来传达信息,因此灰色也具有负面意义。

万字干货!6大章节帮你从零开始系统学配色

④ 红色

红色和人类的关系和黑白一样古老。对于原始人来说,红色代表生命,与血、火、太阳紧密相连,具有激情、激情、冲动、活力、温暖的特点。

在一些国家,深红色也被认为是嫉妒和暴政的象征,因为不同的种族和宗教信仰。在基督教中,红色象征着基督的血液和上帝的爱,而在佛教中,红色是生命和创造的颜色。在红色的感染下,人们会有抵抗的冲动。红色也是颜色符号的国际术语。无论在哪个国家,它都有共产主义的意义,象征着致力于革命洪流的人们的献血和热情。

在中国,红色是中华民族最喜爱的颜色,甚至成为中国人民的文化图腾和精神皈依。东汉、唐、武、宋、明都是红色的。红色逐渐成为奢侈和幸福的象征。

在现代社会,红色用于表示停车、警告、危险、防火等。例如,消防车和救护车的停车信号是红色的。

万字干货!6大章节帮你从零开始系统学配色

⑤ 橙色

橙色具有红色和黄色的特点。它既有红色的热情,又有黄色的明亮活泼的性格。它是颜色中最温暖、最欢快的颜色。橙色在火焰中的比例最大,是最辉煌的颜色。它让我们想起收获的秋天、温暖的阳光和令人陶醉的气氛。这是一种令人满意和快乐的颜色。

万字干货!6大章节帮你从零开始系统学配色

虽然橙色在视觉刺激方面没有红色那么强大,但它的视觉视觉非常高。在工业颜色中,作为警告的指定颜色,如道路工人的工作服、救生衣、建筑工人的头盔和雨衣。

万字干货!六章帮助你从零开始系统地学习配色。 class=

橙色的一般特征是:温暖、快乐、辉煌、满足、快乐、收获、自信、健康。

万字干货!6大章节帮你从零开始系统学配色

⑥ 黄色

黄色代表太阳的颜色,是灿烂的代表。所以人们经常把它与太阳和所有发光的东西高度联系在一起。黄色象征着明亮和希望。秋天收获食物的香气也是所有颜色中可见度最高的颜色。在高亮度下仍然可以保持高色度。因此,黄色通常与神圣的东西联系在一起。同时,黄色也是金色和丰收的颜色,通常与华丽有关。除了上述阳光、柠檬、春节、麦田、向日葵、雏菊香蕉、梨、蛋黄、郁金香、瓜、银杏、啤酒、食物外。

万字干货!6大章节帮你从零开始系统学配色

在中国封建社会,黄色也是一种特殊的颜色。当时,黄色被定义为皇帝的特殊颜色,被视为权力、威严、财富、高贵和骄傲的象征。普通人不允许使用它。在古罗马,黄色也被视为贵族的特殊颜色,象征着光明、希望和未来。

万字干货!6大章节帮你从零开始系统学配色

在大洋彼岸的美国和日本,黄色被认为是思念和希望的代表。在佛教中,黄色被称为最崇高的颜色,代表超俗,僧侣的衣服和寺庙的佛阁大多是黄色的;在基督教中,黄色被认为是叛徒犹大的衣服颜色,是卑鄙和可耻的象征;在伊斯兰教中,黄色让人想起沙漠和干旱,这是死亡的象征。在现代,黄色有时与财富、荣耀和荣耀有关,有时与商业氛围有关,甚至与色情和淫秽有关。

由于黄色亮度高,常用于日常生活中引人注目或告知危险的建筑工地、交通引导标志等。比如小学生戴的小黄帽,是为了过马路时引起过往车辆的注意。

万字干货!6大章节帮你从零开始系统学配色

一般颜色搭配绿色底部,因为绿色本身含有黄色和蓝色的成分,看起来更协调。深蓝色和紫色底部的黄色和黑色底部的黄色达到了他们最明亮和最耀眼的光芒,然后黄色是强大和明亮的。红色背景上的黄色有一种节日的气氛,这是中国人普遍喜欢的颜色组合。

万字干货!6大章节帮你从零开始系统学配色

⑦ 绿色

绿色属于颜色中性的颜色,人们的视觉感觉在心理和生理上都相对温和。我们常见的颜色,除了天空和大海是蓝色的,地球上的绿色面积应该是最大的,大多数植物是绿色的,所以绿色是我们在自然界中最常见的颜色之一,自古以来,人们生活在绿色的怀抱中,所以绿色会给人们一种独特的安全感,在绿色中,人们会感到疲劳,所以医院经常出现浅绿色的色调。绿色被认为是春天、希望、和平、新鲜、安静、年轻、成长、安全、活力和活力的象征。

万字干货!6大章节帮你从零开始系统学配色

《圣经创世记》中有一个故事,“鸽子完成使命后, 绿色橄榄叶通知主人和平。从那时起,鸽子、绿色和橄榄叶就成了和平的象征,所以鸽子也被称为和平鸽。据说现代邮政的颜色来自于这个典故。

万字干货!6大章节帮你从零开始系统学配色

绿色是工业颜色法规中的安全颜色;医疗机构和医疗保健行业的绿色意味着健康、新鲜、安全和希望;绿色食品是无污染、天然、安全的食品。绿色通道是安全通道;在交通信号中,绿灯通过;绿色也被用作国防颜色和保护颜色,因为它接近自然颜色。国际知名的绿色和平组织也以绿色为代表。

万字干货!6大章节帮你从零开始系统学配色

⑧ 蓝色

蓝色是自然界中使用最广泛的颜色。天空和海洋每天都被蓝色包围着,我们都很熟悉。大多数人并不讨厌蓝色。蓝色非常适合表达深远的空间。蓝色可以开放、冷静、理性。除了蓝天和大海,我们的生活中还有很多东西是蓝色的。例如:牛仔裤是蓝色的,车牌(中国)是蓝色的,有些车是蓝色的,有些运动服是蓝色的,这是自然界中使用最广泛的颜色。

万字干货!6大章节帮你从零开始系统学配色

蓝色是许多欧洲人和美国人最喜欢的颜色。它有一种保守和值得信赖的感觉。事实上,蓝色几乎适合每个人的肤色。可以说,蓝色是一种深受世界喜爱的颜色。大海给蓝色带来了神秘。在欧洲文化中,蓝色是上帝的代表性颜色。深蓝色是一种简单内向的颜色,似乎蕴含着大自然的力量。这种力量隐藏在黑暗和寂静中;浅蓝色是天空中流动的大气的颜色,是伟大和永恒的象征。在现代,蓝色是前卫、技术和智慧的象征。许多企业,包括技术、工业、金融等行业,都以蓝色为企业形象的主色调。

万字干货!6大章节帮你从零开始系统学配色

蓝色是所有颜色中最冷的,与橙色形成鲜明对比。蓝色的寒冷使它很容易与雪、树木投影、大海、天空、水等联系起来。不同的蓝色色调有不同的倾向。纯蓝色,简单大方,充满青春气息;微灰色深蓝色让人感觉有一定的风格;浅蓝色,轻盈透明,深空间感;深蓝色(海军蓝)具有稳定柔和的魅力。

万字干货!6大章节帮你从零开始系统学配色

⑨ 紫色

紫色是所有颜色中最低亮度的颜色,也是神秘氛围的制造者。太阳升起落下时从云中透射出来的阳光;我们通常看到的天空和大海不是纯蓝色的,白天和晚上都会有不同程度的紫色。许多花是紫色的,比如薰衣草,别忘了我等等。紫色总是出现在自然界中,两者的搭配和谐动人。

万字干货!6大章节帮你从零开始系统学配色

紫色的贵族感是由历史造成的。紫色是自然界中罕见的颜色。据说在古代,紫色只能从少数动物、植物或矿物中提取。原材料和工艺都表明紫色来之不易,因此稀有而珍贵。紫色因其稀有而珍贵,已成为欧洲皇室和贵族的特殊颜色。中国古代一品官员的官服大多是紫色长袍。

在中国,清华大学 VI 也是紫色的。

万字干货!六章帮你从零开始系统地学习配色

3. 色彩组合

众所周知,对比色和近似色只是配色的一部分,它们只是色环上的色彩组合,也只是指色相上的变化。

万字干货!6大章节帮你从零开始系统学配色

① 近似色

近似色又称同类色,是色相环上两个色相值与色环之间的夹角小于 30 色差很小,给人一种简单、稳定、温和的感觉,可以保持画面的统一。画面的立体感只能通过色彩的明暗参差来表现。如果要突出画面,可以点缀对比色,增加画面的亮点。

万字干货!6大章节帮你从零开始系统学配色

万字干货!6大章节帮你从零开始系统学配色

② 类似色

色相环上的两个色相值与色环之间的夹角不得超过 60 程度。常见的搭配有红色和黄色、橙色和绿色、绿色和黄绿色。由于相邻的颜色在亮度和纯度上可以形成很大的对比效果,这种颜色匹配使图片呈现出丰富和跳跃的感觉。

万字干货!6大章节帮你从零开始系统学配色

万字干货!6大章节帮你从零开始系统学配色

③ 中度色

中度色又称临近色,是指色相环上的两个色相值与色环之间的夹角小于 90 度,大于 60 度,属于色相中的中对比,能保持画面的统一感,使画面显得十分丰富活泼,在色彩上有主有次的配色能增强吸引力。

万字干货!6大章节帮你从零开始系统学配色

万字干货!6大章节帮你从零开始系统学配色

④ 对比色

色环上的两个色值对比较大,一般是两个色值和圆之间的点连成线的夹角小于 180 度大于 90 我们称之为对比色,效果鲜明,饱满,容易给人带来兴奋和兴奋。在一些作品中,它通常被用来表达休闲、跳跃和强烈的主题,以吸引人们的注意力。

万字干货!6大章节帮你从零开始系统学配色

万字干货!6大章节帮你从零开始系统学配色

⑤ 互补色

两个色值之间形成的夹角为 180 度,我们称之为互补色,对比度最强,画面最丰富,感官刺激性最强的色彩组合,经常被人们表达出极大的对比,用来突出对方的目的表达。

万字干货!6大章节帮你从零开始系统学配色

万字干货!6大章节帮你从零开始系统学配色

4. 设计中的颜色

一般来说,我们设计的布局上的颜色层次包括主色、辅助色和装饰色。在国外,设计师们早就总结出了一个通用的配色规则,即 加上70%的主色 辅助色25%,加上辅助色 5%的点缀色。

万字干货!6大章节帮你从零开始系统学配色

① 如何确定主色

当我们收到设计任务时,我们肯定会有一个主要的产品或信息来突出它。主色,是整个作品的主色,它会影响你对整个作品的感官印象,或产品的企业色彩,统一企业形象,作品想要传达的感觉,主要是通过这种颜色,不可替代,改变其他颜色,整个作品传达的主题已经改变。

(1)主色面积较大,较为显眼,一目了然,即主色。

万字干货!6大章节帮你从零开始系统学配色

(2)在画面中,虽然面积不大,但在画面中间,颜色更显眼。

万字干货!6大章节帮你从零开始系统学配色

② 辅助色

辅助颜色一般像红花和绿叶的作用,根据合理的比例大小匹配整体布局,辅助颜色和主要颜色将更适合搭配或企业形象已经预订了辅助颜色。

万字干货!6大章节帮你从零开始系统学配色

③ 点缀色

装饰颜色的功能:指导和提示,一般装饰颜色的面积一般相对较小。装饰颜色一般像夜晚的星星,更引人注目,但不会破坏布局的和谐,就像烹饪时添加的辅助调味品一样。装饰颜色可以是多种颜色。如果有更多的装饰颜色,你也可以形成一定的风格。

“万字干货!六章帮你从零开始系统学配色。”

5. 色彩的功能

一般来说,色彩在一个好的布局中起着画龙点睛的作用,在布局中,色彩具有分割信息、突出视觉中心、引导视线的作用。

万字干货!6大章节帮你从零开始系统学配色

① 分割版面

在设计工作中,有时材料有限,但需要排列的信息相对混乱。此时,布局可以通过颜色分成几块,这有助于规划布局。

万字干货!6大章节帮你从零开始系统学配色

② 聚焦视觉中心

在设计和执行工作中,有时我们需要突出图片中的一些内容。我们可以通过添加颜色来平衡图片来显示我们需要显示的信息和产品。

万字干货!6大章节帮你从零开始系统学配色

③ 视觉引导

视觉引导是设计中非常常见的技术,通过颜色引导视线也是其中之一。例如,无色中的颜色会吸引我们的眼睛聚焦在哪里,我们的视线会根据颜色的指导来走,这就是指导的作用。

万字干货!6大章节帮你从零开始系统学配色

6. 颜色搭配合理

如果你想搭配合理的颜色,你首先需要知道一些关于颜色的基础,然后你需要在合适的场景中使用合适的颜色搭配,这样颜色就不会太突然。

万字干货!6大章节帮你从零开始系统学配色

7. 配色法则

当我们搭配颜色时,如果我们没有经验,我们可以参考前人总结的一些配色技巧和配合规则,如平衡规则、焦点规则和同频规则。

万字干货!6大章节帮你从零开始系统学配色

8. 平衡法则

色彩平衡法则是色彩搭配中更重要的法则。我们都有稳定和平衡的视觉和心理需求,我们一直生活在一个以平衡为美的时代。在色彩设计中设置一对或多对平衡色可以满足心理需求,工作本身很容易实现稳定和谐的色彩关系。

万字干货!6大章节帮你从零开始系统学配色

让我们首先考虑一个问题,为什么要做颜色搭配,颜色搭配的主要原因是让颜色搭配可以和谐、平衡、舒适,这些都是我们直观的感觉,这也是我们做颜色搭配的目的。举个简单的例子,当我们的身体很冷的时候,当我们喝一杯热牛奶时,我们的身体会感觉更舒服,这就是平衡。

万字干货!6大章节帮你从零开始系统学配色

有一个平衡法则 6 个法则:

平衡冷暖色平衡深浅色平衡色平衡背景色和纯色平衡面积

① 色相平衡

通过色环上的色彩组合来平衡画面,通过上面介绍的色彩组合来合理匹配布局。例如,常见的互补色平衡是一种。互补色平衡更适合协调视觉刺激的平衡。适用于夸张、宣泄和强烈的情感表达。

万字干货!6大章节帮你从零开始系统学配色

② 冷暖色平衡

冷暖平衡通过色相环上的冷暖属性进行画面平衡。色彩冷暖平衡是一种常见的设计规则,我们会在无意中或有意中使用。因此,冷暖平衡可以大胆使用。如果使用得当,色彩设计作品可以非常出色。

在使用冷暖平衡时,应注意以下几点:首先,根据产品色调搭配主色调,辅助色调相反,如主色调为暖色,辅助色应选择冷色,使色彩设计图片平衡。

万字干货!6大章节帮你从零开始系统学配色

③ 深浅色平衡

深浅色平衡实际上是指使用颜色深度对比来平衡图像。如果设计布局是深色的,很容易显得沉闷,如果是浅色的,很容易感觉没有焦点。

万字干货!6大章节帮你从零开始系统学配色

④ 彩度平衡

在设计中,黑色、白色和灰色是无色的。色度平衡是指通过有色和无色来达到平衡。一般来说,它是指设计布局中无色图片的颜色。只有使用无色图片,才能使图片具有重心。

万字干货!6大章节帮你从零开始系统学配色

⑤ 背景色与纯色平衡

背景色可以简单地理解为图像或背景色的纹理,或由多种颜色组成的组合。背景色和纯色的搭配不仅可以展现单色的魅力,还可以突出设计和颜色的节奏。

万字干货!6大章节帮你从零开始系统学配色

⑥ 面积平衡

布局中的面积大小会有自己独特的节奏,使色彩设计具有层次感、节奏感和画面感。如果所有的颜色都是一样的,那么图片就会显得普通,没有主次之分。例如,主标题文本与辅助信息的大小字体和字体厚度的面积之间存在差距。

万字干货!6大章节帮你从零开始系统学配色

9. 聚焦法则

色彩聚焦是通过色彩引导将用户的视线引导到他们想要看到的图片中。当我们看到一件设计作品时,首先要注意的是颜色。所有设计师都需要通过设计技术引导用户的注意力,从而实现设计传达的信息,即通过聚焦规则传达设计信息。

“万字干货!六章帮你从零开始系统学配色。”

① 色彩对比聚焦

聚焦区域一般是通过色彩对比产生的,通常是色相差异最大,对比效果最好,容易形成聚焦。

万字干货!6大章节帮你从零开始系统学配色

② 色块聚焦

聚焦区域一般通过颜色层次区分,即通过颜色划分区域。色块聚焦有秩序感,按一定顺序看图片。

万字干货!6大章节帮你从零开始系统学配色

六、同频法则

同频法则是指我们将色彩视为一种统一的组合形式,使画面看起来更加和谐,提高画面细节,增加层次感。

1. 色相相同

颜色相不变,颜色深度的变化增加了画面的层次。

万字干货!6大章节帮你从零开始系统学配色

① 同样的颜色倾向

同时出现多组色彩,色相倾向相同,使色组气质统一,画面平衡。

万字干货!6大章节帮你从零开始系统学配色

② 群组相同

通过颜色组合(多种不同的颜色)或相同的形状,形成相同频率的颜色组,通常用于设计规范或 VI 在图像设计中。

万字干货!6大章节帮你从零开始系统学配色

③ 同频呼应

使用与主题相同的频率颜色,可以整合图片,如商品的背景使用与商品相同的颜色。

万字干货!6大章节帮你从零开始系统学配色

本文介绍的色彩基础到此结束,大家慢慢消化哦,有问题可以在评论中讨论~