涉及到颜色时，您可以使用几乎无限的调色板。 了解如何正确地做到这一点。

在设计网站时，您可以选择高达1680万种颜色。 当你开始将它们组合成一个调色板时？ 您的一系列选择立即变得无限。

为了让您入门，我将深入探讨以下主题：

词汇 - 从色调到饱和到温暖等等，我们将涵盖语言设计师在说话时使用的颜色

色轮 - 用于可视化颜色之间关系的强大工具

配色方案 - 如何使用色轮选择您的配色方案

色彩心理学 - 人们通常与特定颜色相关的感受和意义

工具和资源 - 应用程序和指南帮助您掌握颜色设计

为什么你应该关心颜色

如果有人把你的钥匙交给你的梦想车，免费的话，你的头会兴奋地爆炸，对吧？ 当然！

但如果这辆车被漆成你最讨厌的色调呢？ 或者每个面板完全是不同的颜色？ 或者如果室内混合石灰绿和建筑黄色？

你可能不太兴奋，对吧？

颜色有意义。 它们就像字体一样传递语气和情感冲击，这使得它成为一个强大的设计工具。

颜色的词汇
在我们深入理论之前，您需要了解以下术语：

原色是所有其他色调的基础。 人类感知三种基本颜色：品红色，青色和黄色。 我们所看到的每一种颜色都包含这三种颜色的组合，其数量，亮度，色彩和阴影（见下文）不尽相同。

传统上，我们认为红色，蓝色和黄色是主要颜色，但研究表明洋红色，青色和黄色更能描述我们的颜色体验。

在网络上，我们使用RGB（红绿蓝）和十六进制值来表示颜色。

RGB颜色系统将所有颜色定义为三个不同值的组合：一个特定的红色，另一个绿色，另一个蓝色。 所以：

- rgb（59,89,145）等于Facebook蓝色

- rgb（0，0，0）等于黑色

- rgb（255,255,255）等于白色

十六进制颜色系统将每个值转换为十六进制（基数为16）的表示形式，如下所示：

- ＃3b599b等于Facebook蓝色

- ＃000000等于黑色

- #ffffff等于白色

每两个字符代表一个颜色值，因此对于Facebook蓝色，红色为3b，绿色为59，而9b为蓝色。

热和冷

颜色也有"温暖"，每种颜色都可以分为温暖或凉爽的颜色。

温暖的颜色含有更多的红色和黄色。 他们可以在设计中唤起一种温暖和激情。 他们也可以感觉到非常具有侵略性和大胆，提醒我们国际停车标志。 这就是为什么红色经常用于错误消息。

凉爽的颜色包含更多的蓝色，引起寒冷的气候，冰，冬天，水，夜间，死亡和悲伤。 它们可以带有孤独，冷漠和恐惧的内涵。 凉爽的颜色也不那么积极和舒缓。 想想蓝天，或者海滩上清澈湛蓝的海水。 放松了吗？

温度

增加图像的温度意味着增加其橙色水平。 它通常使图像看起来更暖和更快乐，类似于当太阳在其上投射橙色光芒时世界看起来更快乐。 相比之下，降低图像的温度使其看起来更冷，更不容易吸引，就像阴天。

色调和阴影
当您添加黑色时，将颜色添加到白色 - 色调会导致色调。 色调和阴影可让您通过将不同级别的白色和黑色添加到基本颜色来创建单色配色方案。

例如，如果您的底色是＃8dbdd8（浅蓝色），如下图所示，您可以通过选择两个色调（两个较亮的蓝色）和两个色调（两个较暗的蓝色）来创建单色方案。

饱和度，色调和亮度
饱和度描述了颜色的强度。 饱和度越高，颜色越浓，颜色越深，而饱和度越低，颜色越淡。 当我们说"浅蓝色"或"深绿色"时，我们正在描述饱和度的变化。

色调定义了颜色可以被描述为与红色，橙色，黄色，绿色，蓝色，靛蓝和紫色（彩虹颜色）相似或不同的程度。 所以当你描述一种颜色为"绿蓝色"时，你用两种色调来定义它。

亮度，也称为价值或色调，定义了与纯白色相比的颜色的感知亮度。

色轮
基本色轮包含用于创建配色方案的12种标准色。 馅饼的每一片代表一系列颜色，可以通过不同的饱和度，色调，色调，阴影和相邻颜色的混合来实现。 组合的颜色（例如，黄色 - 橙色）由混合等量的基础色调（黄色和橙色）而产生。

红色，黄色和蓝色是原色。 紫色，橙色和绿色是次要颜色。 其他一切都是第三种颜色，主要和次要颜色的混合。

设计使用色轮来选择配色方案，它有四种风格。

4种配色方案
设计师通过配对色轮中的多个颜色族来创建配色方案。 当您遵循以下某种模式时，这通常效果最佳。

1.单色
单色配色方案由各种色调，阴影和单一基色的饱和度组成。 它们非常有凝聚力，但会冒着变得单调的风险。
2.补充
补色方案基于色轮两侧的两种颜色。 因为这两种色彩会有很大的不同，所以这种方案可以非常有效且引人注目。

专业提示：为您的号召性用语选择一种补充颜色。 使用下面的方案，如果您的页面背景为薄荷绿色，则可以使用粉红色作为CTA按钮。

3.类似
类似的方案具有三种颜色，在色轮上彼此相邻。 由于色调的相似性，这些方案可以产生非常有凝聚力，统一的感觉，而没有单色方案的单调性。

4.三位一体
要制作三色配色方案，请在色轮上绘制等边三角形（所有三边长度相同的三角形），然后在三角形的点处选择三种颜色。 这创造了一个多样但平衡的方案。

色彩心理学
每种颜色都有其独特的色调和意义。 通过仔细选择你的颜色，你可以加强一个网站的整体信息。

注意：不同文化和地区的颜色含义可能会有很大差异。 以下描述主要针对美国。

红色
这种充满活力和积极的色彩可以根据具体情况传达各种含义，但它具有强大的功能和天赋。 将它与黑色结合为一款男性气质，极具侵略性，适合运动型跑车。 将它与白色和金色搭配，它说明了爱与激情。 红色也代表危险 - 认为停止迹象 - 和血 - 认为红十字会。

橙色
温暖，但不如红色，橙色很难错过 - 这解释了它在建筑，安全和狩猎设备中的用途。 它也几乎尖叫秋天，南瓜和万圣节。 橙色的温暖可以唤起有趣而充满活力的氛围。

黄色
黄色代表阳光，温暖和夏季。 这也是光谱中最明显的颜色，所以它真的会跳出来。 与白色或黑色相结合时，它尤其引人注目，就像安全设备，校车和出租车一样。 尽管如此，尽管如此，请小心，因为很多人都感到不适。

蓝色
蓝色唤起天体，热带和奇怪的专业。 鉴于它与水的长期联系，我们认为蓝色是清新和清洁的。 然而，更深的蓝色调可能会引起悲伤。 毕竟，我们称之为"蓝调"是有原因的。

绿色
作为大多数植物生命的颜色，绿色表现出增长和健康的感觉，使其成为有机，环保和健康产品的完美选择。 将它与蓝色和棕色相结合以捕捉自然。 格林在美国也代表财富和金融。

棕色
你不会在网上看到太多的褐色，可能是因为它意味着肮脏。 但如果你想创造一种土质感和奢华感，这可能是一个复杂的时尚网站。

紫色
在古罗马，只有富人才能买得起紫色（这种染料是由蜗牛壳制成的）。 这几个世纪后，这种联系依然很强烈，使紫色成为奢侈品牌的理想色彩。 当与红色相结合时，它可以感受到亲密和浪漫。 随着白人和粉红色，它变得俏皮和孩子般。

白色
白色是关于纯洁，纯真和不育的。 你会在专注于婚礼，医疗保健，科学和灵性的网站上看到它。 它也意味着清洁和新鲜的感觉，如新洗和折叠的床单。

黑色
黑色意味着力量，奢侈，邪恶，死亡和未知。 善与恶之间的战斗表现为白与黑 - 只看达斯维德和卢克天行者的平时服装。

颜色工具和资源
由于所有复杂性和灵活性都可以通过颜色设计进行设计，因此设计人员已经构建了一系列工具来帮助处理流程，这应该不会让您感到意外。 这里只是我们最喜欢的几个。

配色方案（调色板）发电机
我最喜欢的两个调色板生成器可让您手动选择每种颜色，或者根据一种或两种颜色自动生成它们。

COLOURCODE为单色和互补等方案类型提供了预设模式，并且您可以将您的方案导出为.scss，.less，图像或只是永久链接。 这也是一个有趣的发现工具，因为鼠标在屏幕上移动时阴影会更新。

Adobe Color CC，以前称为"Kuler"，还具有方案类型预设功能，但增加了COLOURCODE没有的两个优点。 首先，Color具有内置的社交层，因此您可以探索其他人的调色板。 第二个（也是最优越的）是从图像中提取颜色方案的能力。

调色板的灵感
伟大的色彩组合需要灵感吗？ 以下网站使用图像和设计来说明不同颜色如何协同工作。 用它们来帮助指导你的选择。

颜色使用灵感
需要同行设计师的灵感？ 除了：

色彩非常重要，星巴克等特许经营商对其每个特许经营地点的色差都有极低的容忍度。每个加盟商必须从批准的颜色列表中进行选择。在通向咖啡厅的门打开之前，总部的一位代表将确保墙上的颜色符合严格的公差要求。

正确使用颜色，并且您的网站会感觉更加自然并放在一起。现在你已经掌握了基本知识，我鼓励你继续走进色彩理论的道路。但最重要的是，请务必查看正确使用颜色的美丽示例，并练习，练习和练习。