本文会讲述于其中运用有价值的“色彩理论”，以及“工具和资源”，以此开展工作，同时还会着重于“实际示例”，助力你更具自信地从事设计创作，并且借助其中的功能示例，来帮你更高效地开展设计。

为什么要注重在UI中使用正确的颜色

是颜色，它可不只能够让UI变得更具吸引力，而且还能够给用户以及企业带来好多好多的好处。

颜色对用户体验起到了增强作用，正确的调色板能让内容读起来或许更舒适，特定区域和对象会有更多意义，且更易引发关注。颜色强化了品牌个性，颜色的运用能让公司或产品品牌建立起更好的联系，进而使UI获得信任感，让用户觉得自己找对了地方。颜色有助于达成目标，颜色能助力创作者和用户以恰当方式交流，若想警示正在使用应用程序的某人，可借助使用正确颜色（通常是红色）来达成。为此，用户会即刻知晓这是一条具备阅读价值的消息。另一方面，按钮呈现的绿色或许会促使用户购买特定产品，原因在于这意味着这会是一个安全的操作流程。

数位设计中的色彩模型

让我们在学习更多实用技巧之前先了解一些色彩理论。

这些是用于数位设计的最受欢迎的颜色模型：

/HSB

红色、绿色、蓝色所构成的 RGB，属于加色模型，这指的是把红色、绿色以及蓝光按照各式各样的方式进行相加，进而产生出各种各样的颜色。

HSL，即（色相，饱和度，亮度），它是RGB模型的替代表示方式。在HSL里，每种色调的颜色都是围绕着中性色的中心轴，呈放射状切片放置的，而中性色的范围呢，是从底部的黑色一直到顶部的白色。

HSV/HSB，其呈现为（色相，饱和度，值或亮度）这般状态，此颜色方案常常被错当成HSL，然而它却是RGB模型的另外一种可供替代的表示形式。如同HSL一样，HSV颜色的每个色调都被安置于径向切片当中，环绕着中性颜色的中轴，其范围自底部的0%延伸至顶部的100%，各不相同。

中的颜色模型

支持上述全部模型，所以你在工作里能够用到它们。接下来，你会发觉一些有用的提示，知晓怎样运用 HSB 模型去创建更优的色调。

配色方案

正确使用调色板对于使应用程序更具吸引力至关重要。

存在着这样一些颜色，当它们跟另外一种颜色一块儿搭配着去使用的时候，会显得看上去更加好看，这便是构建配色方案的缘由所在，它们助力设计师去为其余的那些色调寻觅到恰当的搭配组合，以下是几种不同的配色方案：

单种颜色，近似的颜色，相互补充的颜色（也就是对比色），三种颜色平均分配的配色方式，通过补色进行分割的配色方法，Split方式的配色，方形形状的配色，矩形形状的配色。

下面将介绍最流行的4种配色方案。

按同一色调所含的不同色调、明色调以及阴影所构建的配色方案即是单色 ，若要于应用程序里加以使用 ，需留意UI或许看上去没那么有意思。

单色配色 color

存在这样一种情况，彼此相邻的3种颜色能创建相似的配色方案，将其称为近似色 ，它具备很容易创建的特性，而且相较于单色方案而言更具吸引力。

近似色配色法

互补也称对比 ，当你组合2种颜色 ，这2种颜色取自色轮的相反两侧时 ，会创建出该方案 ，它们可能还包含这些颜色的色调以及阴影。

互补(对比)配色

所谓三等分，是一种由3种色调所构成的配色方案。这3种色调，在色轮周围呈均匀分布态。此配色方案sketch ios ui design，要获取到好的方案是颇具难度的。然而，它们却能够让设计更具吸引力。

三等分配色法

在中创建配色方案

有一些工具和插件可帮助你快速创建自己的调色板。

有一个插件，是能从图纸里的照片上提取颜色的。还有一个插件，是有用的，能让你在其中保存以及加载调色板。此插件能使你从不同格式去导入各种各样的颜色样本。它具备多种功能，其中包括能够借助它来创建色彩样式指南。

神奇的60–30–10规则：最佳色彩平衡

备受室内设计行业所熟知的，那堪称永恒持久不变的装饰原则，是60 - 30 - 10规则，它极为简易且富有成效，此规则被用以于配色方案里寻觅恰当适宜的平衡。

60％ + 30％ + 10％是所用颜色之间的比例：

百分之六十，应是属于主颜色的数量，百分之三十，是次要颜色区域，百分之十，其余部分属于强调色。

如何在UI设计中使用60-30-10规则?

虽说该原理是在室内设计范畴产生的，然而你同样能够成功地把它运用到数字化设计里。把应用程序或者页面当作内容的空间并且运用规则让设计变得更加平衡。

灰色不应为纯灰色

虽说灰色可是那种不太显眼的色彩，然而在用户的眼里，它却能够胜出。要是你跟我这般模样，那你会在好多地方去寻觅灵感。瞧瞧建筑方面，如今在建筑上我们运用着好多灰色调，而且，它对现代建筑而言可是相当适配。我还察觉到，越来越多的汽车呈现出灰色，并且它们看上去极具吸引力。

好的，灰色并非那种纯粹的灰色，要是你于中性色调之上增添些许颜色，那么便会产生奇妙的效果。

灰度 - 如何在UI设计中使用它？

当你思索于应用里运用灰色之际，纯灰色兴许并非那般具有吸引力。为能够让你的UI看上去更出色，试着给中性色调增添些许色相以及饱和度。如此一来会致使用户感应到中性色调更为自然。

对于我们的眼睛来说，使用并非百分之一百的灰色是至关重要的，它能让一切看上去更为自然，就连苹果公司也已然开始采用了，所以，iPad对应的显示屏会依据照明温度予以调节，从而让人感觉好似更加自然。

中的灰度

就算你得留存着按自身恰当的办法去设定中性色调，然而你也能够运用简易的插件来让你的画板呈现出灰色（纯粹的灰色色调）。

色调（Tones） —— 使UI更具吸引力的技巧

在本节中，将向你展示如何使UI的色调变得更加生动和吸引人。

首先，让我们了解如何构建不同的颜色变体。

要是去观察现实世界里颜色是怎样彼此作用的，你就会发觉，阴影与色调可不单单是亮度出现变化而已，很多阴影有着比主色还要多的饱和色调。另一方面，启蒙区域更明亮，然而饱和度却更低。要是你想让自身的设计给人感觉更自然些，那你同样应当遵循这个发现。

于其中打造出较为深邃的颜色变体，挑选一种品牌色。把应用程序颜色选择器切换至HSB模式。把B（HSB的亮度）调低至适配较暗变体的程度。增添S（HSB的饱和度）的值，使其更具吸引力。大功告成！

暗色调的制作

在当中去创建较为浅淡的颜色变体，从中挑选出一种品牌颜色，把应用程序颜色选择器切换至HSB模式，将B也就是HSB里的亮度这个值提升到契合较浅色调的水准，把S的值也就是HSB的饱和度予以降低，完成！

制作浅色调

通过这种简单的操作，你的颜色变体在调色板中看起来会很好。

颜色可访问性 —— 适合所有用户的设计

对那些以和我们大多数人不同于的方式去感知色彩的人加以记住，这是十分重要的。颜色在我们的感知里，有着重要的作用。

为促使你的网络或者移动的解决办法全然具备可访问性，你应当运用WCAG 2.0准则去确认你的该解决办法否合乎标准。

倘若你是针对特定平台，像是iOS之类去开展UI的设计工作，那么就应当去遵循其关于视觉设计可访问性的那些准则。

Apple iOS HIG — Color and —

的色彩可访问性

为保证得以让所有的颜色都能够符合Web辅助功能方面的指南，我给出这样的建议，就是去使用Stark ，它具备这样的功能，那便是允许你去检查对比度，并且还能够模拟色盲的情况。

颜色含义与文化背景

如何感知解决方案，颜色对其产生了巨大影响。在每种文化里，正确的语调都有其意义。它们还和我们的情绪有关。

以下是基本颜色及其与情感和含义的关系：

新鲜的、干净的、现代的、纯洁的是白色：，中性的、有些微妙的是灰色：，神秘的、力量的、奢华的、邪恶的是黑色：，力 量的、行动的、自信的、爱的是红色：，安全的、镇定 的、舒适的、值得信赖的是蓝色：，新鲜的、自然的是绿色：，警告的、冒险的、快乐的是黄色：，能量的、幸 福的是橙色：

颜色所具有的含义，或许会因为你日常居住的文化环境而产生不同。要是你打算去探究这种差异sketch ios ui design，那么随时都可以去阅读这篇文章。

设计针对特定市场时，要了解其含义，这能助你的UI有更多意义，还能避免错误。

中颜色操作的其他提示

要得到常用颜色，就要去检查中常用的颜色，请点击“颜色选取器”标签右侧的图标，它展示了文档里最常用的颜色列表。

查找以及替换颜色，当你非得迅速切换文档之中的调色板之际，在这里能够达成这一点。若要更改颜色，需从菜单里选择“编辑 大于 查找（Edit > Find）并且替换颜色( Color)”（也能够按++F键）。

还有一些别的选项，这些选项能让你进行配置，此配置关乎颜色修改，而这颜色修改是否会对具有不同不透明度的颜色产生影响呢。

其他有用的工具

这些工具可以帮助你为UI设计构建正确的调色板：

Adobe . Color Wheel

调色板灵感

要去构建出优良的用户界面调色板，寻觅到灵感是颇为重要的。以下这些网站将会为你给予近乎所有调色板方面的协助：

总结

颜色于我们的设计而言，起着相当重要的作用，大多数情形下，我们会凭借直观去运用它们，然而，更为具有意识的办法会收获更佳的成效，并且会使用户体会到别样不同。

如有侵权请联系删除！