视觉设计 » 一种配色原则60-30-10方法,如何为界面选择颜色

一种配色原则60-30-10方法,如何为界面选择颜色

发表于: 视觉设计. 评论
Sponsor

60-30-10 是一种基本的配色原则,它是指在设计工作中,使用三种不同的颜色来划分一个整体配色方案,这三种颜色的使用比例为:60%、30% 和 10%。

一种配色原则60-30-10方法,如何为界面选择颜色

60%色彩比例

这是主色或原色。这是最突出的一个。选择这种色调时,了解它的含义很重要。它应该反映您的品牌信息。         主色或者是原则选择可以参考一下色彩心理学,不同颜色在人们心中所代表的意义和情感色彩

一种配色原则60-30-10方法,如何为界面选择颜色

1.红色:红色是一种非常鲜明、活泼和有力量的颜色。在色彩心理学中,红色代表着爱、激情、力量和冲动等情感,它可以激发人的情绪和热情,但同时也会使人感到紧张和不安。

一种配色原则60-30-10方法,如何为界面选择颜色

2.蓝色:蓝色是一种稳定、平静和清新的颜色。在色彩心理学中,蓝色代表着安静、冷静、专注和信任等情感,它可以缓解人的紧张情绪,使人感到平静和放松。

一种配色原则60-30-10方法,如何为界面选择颜色

3.黄色:黄色是一种充满活力和热情的颜色。在色彩心理学中,黄色代表着快乐、温暖、兴奋和创造力等情感,它可以激发人的乐观和积极心态,但过度的黄色也可能使人感到不安和烦躁。

一种配色原则60-30-10方法,如何为界面选择颜色

 

4.绿色:绿色是一种平和、安静和安定的颜色。在色彩心理学中,绿色代表着平静、健康、成长和自然等情感,它可以使人感到平和和安全,但过度的绿色也可能使人感到沉闷和无聊。

一种配色原则60-30-10方法,如何为界面选择颜色

5.紫色:紫色是一种神秘、高贵和浪漫的颜色。在色彩心理学中,紫色代表着精神和身体的平衡、创造力和幻想等情感,它可以激发人的创造力和想象力,但同时也可能使人感到孤独和沉闷。

一种配色原则60-30-10方法,如何为界面选择颜色

6.橙色:橙色是一种充满活力、热情和创造力的颜色。在色彩心理学中,橙色代表着温暖、热情、活力和创造力等情感,它可以激发人的乐观和积极心态,但过度的橙色也可能使人感到焦躁和不安。

一种配色原则60-30-10方法,如何为界面选择颜色

7.粉色:粉色是一种温柔、浪漫和柔和的颜色。在色彩心理学中,粉色代表着柔和、温柔、浪漫和幸福等情感,它可以带给人们安心和愉悦的感觉,但过度的粉色也可能使人感到过于柔弱和缺乏力量。

一种配色原则60-30-10方法,如何为界面选择颜色

8.灰色:灰色是一种稳重、成熟和低调的颜色。在色彩心理学中,灰色代表着平静、安定、成熟和高雅等情感,它可以使人感到冷静和平和,但过度的灰色也可能使人感到沉闷和无聊。

一种配色原则60-30-10方法,如何为界面选择颜色

9.黑色:黑色是一种神秘、高贵和稳重的颜色。在色彩心理学中,黑色代表着神秘、高贵、稳重和专注等情感,它可以使人感到冷静和高雅,但过度的黑色也可能使人感到抑郁和沉重。

 

定主色就可以参考色彩心理学,我认为这种颜色是项目的主色。

一种配色原则60-30-10方法,如何为界面选择颜色

 

第2步

选择主要颜色后,您可以使用颜色资源生成接下来的两种颜色。生成颜色的资源很多,但我使用的是:

 

我常用的在线配色工具,给大家推荐一下,需要的就收藏起来!

 

一种配色原则60-30-10方法,如何为界面选择颜色

ColorSpace – 调色板生成器和颜色渐变工具

一种配色原则60-30-10方法,如何为界面选择颜色

Paletton – 配色方案设计师

 

一种配色原则60-30-10方法,如何为界面选择颜色

Coolors – 超快的调色板生成器!

 

用调色板生成其他的配色组合,可以得到颜色的数据。

 

一种配色原则60-30-10方法,如何为界面选择颜色

30%色彩比例

这是二次色或互补色。这种颜色的用量是主色调的一半。这用于主要元素,例如文本、轮播和其他重要功能次要颜色支持主要颜色,但仍然足以形成对比。

 

10%色彩比例

这是强调色。这种颜色可用于按钮、弹出窗口、突出显示等。明亮、充满活力的颜色是增加视觉趣味的好方法。它们可以帮助将注意力吸引到页面的特定区域或使页面整体感觉更生动。选择主色后,我将其与其他两种颜色进行平衡,以生成如下所示的最终设计

 

一种配色原则60-30-10方法,如何为界面选择颜色

 

以下是如何应用此方法的几个示例:

 

一种配色原则60-30-10方法,如何为界面选择颜色

 

一种配色原则60-30-10方法,如何为界面选择颜色

 

一种配色原则60-30-10方法,如何为界面选择颜色

 

一种配色原则60-30-10方法,如何为界面选择颜色

 

一种配色原则60-30-10方法,如何为界面选择颜色

 

一种配色原则60-30-10方法,如何为界面选择颜色

总结

l选颜色的适合要注意颜色的配比,分出强调色、辅助色和主色

l使用颜色生成器可以提高工作效率,而且有理论依据

l多生成几套颜色,增加选择的空间

作者:李波

来源:CLD设计研习社(ID:HelloCloud789)

赞助商链接
赞助商链接
设计达人微信交流社区:shejidaren888
喜欢这篇文章吗?欢迎分享到你的微博、QQ群,并关注我们的微博,谢谢支持。
版权:除非注明,本站文章均为原创文章,转载请联系我们授权,否则禁止转载。

{ 发表评论 }