ui配色原则(ui配色的种类和技巧)-九游娱乐

ui配色原则(ui配色的种类和技巧)

本文主要介绍ui配色原理(ui配色的类型和)，下面跟着东辰网详细了解一下吧。

方法一::色轮配色

色轮由12种基本颜色组成。

首先，它包含三原色，即蓝、黄、红。

原色混合产生二次色，二次色混合产生三次色。

色轮由五个同心圆环组成，从暗到亮——暗在大圆环，亮在小圆环，中间是颜色的基本色相。

根据颜色之间的关系，有以下几种配色分类。

一、单色配色

单色搭配是用一种颜色作为主色调，然后用颜色的深浅来搭配的方法，即在色轮中，一个色相的暗、中、亮三种色调是单调的，所以用颜色的深浅来增加颜色的种类。

优点:画面统一，搭配比较简单一般不会给人难看的感觉，一般不会给人难看的感觉。

凯斯:

b、相邻配色

彩色相位环上的相邻颜色彼此相邻。

优点::色调统一，对比度低，美感和谐。这种色彩组合产生一种赏心悦目的和谐美感，对比度低。类比色彩非常丰富，在设计中运用这种搭配也很容易让你产生良好的视觉效果。

凯斯:

c、补色和对比色的搭配

补色是在色相环上180相对的两种颜色，对比色是在色相环上150到180相对的两种颜色。

优点:互补色和对比色形成强烈的对比效果，传达活力、能量、兴奋等含义。要达到补色的最佳效果，最好是其中一个面积比较小，另一个面积比较大。例如，在带有橙色圆点的蓝域。

凯斯:

d、拆分补色配色

如果用互补色和模拟色来确定颜色关系，就叫互补色。

优点:这种色彩搭配既有类比色低对比度的美感，又有补色的力量感。形成了和谐而集中的色彩关系。比如以上三种颜色中，红色比较突出。

凯斯:

f、二次配色

在二级色之间有一个。有两种常见的颜色——两个共用蓝色，两个共用黄色，两个共用红色，所以很容易形成和谐的搭配。

优点:三种二次色同时使用的话，非常舒服和吸引人，色彩丰富。它们同时具有色彩的深度和广度，这在其他色彩关系中很难找到。

凯斯:

方法二::重叠柔和配色法

这个方法看起来很复杂，但是用起来很简单。

主要分三步走。

2.然后在混合模式下选择叠加或柔光。

3.调整透明度(1%100%可选，省心的办法是直接输入整数值，比如轻纹理页面可以选择20%40%，重纹理页面可以输入60%以)。

如下图所示(使用柔光色块的混合模式，并调整不同的值以获得不同的效)

方法3:颜色提取法。

这种方法是从现有的自然色和画面色中提取出想要的颜色，为应用和搭配赢得了大量的时间。

1.找一张图片

找一张符合你想要设计的界面风格的图片(本教程使用的图片是银河S4的壁)。

2、提取颜色

把图片放进PS，点击存储所有网页格式(Windows快捷键是CtrlshiftAl)，选择png作为格式，8作为色块。

颜色显示区还剩下8种颜色。单击颜域右侧的下拉按钮，找到商店颜色表及并把它放在桌面上或你容易找到的地方。然后用PS打开，你刚提取的颜色就会显示在色样里。

成功提取了八种颜色。

3.应用

具体的颜色应用是:

1.导航文字和logo的颜色是最浅的蓝色；

2.横幅区是大背景，这里用的是开头的图片。上面的头条logo用的是最深的蓝色；

3.内容区提取的三种色调的颜色如果只排列剩下的颜色会很鲜明，所以用几张图过度渲染了画面的节奏。现在看来效果还不错，内容区的文字颜色和导航文字一致，是最淡的蓝色；

4.内容区的几个按钮用白色叠加，而不是提取的颜色，然后调整透明度。

总结:以上三种配色方法完全不同，希望能多多少少给你带来一些收获。在学习新方法的同时，也要学会举一反三，结合自己已有的经验和设计师对色彩的独特感觉。