以下是我个人收藏的一些渐变配色网站,并且使用过后感觉比较好的整理出来分享给大家,每一个网站都各有千秋,它就是一个设计工具,工欲善其事必先利其器,学会正确的使用工具可以帮助设计师快速成长,提高效率,希望对大家有帮助。
1、CoolHue
网址:https://webkul.github.io/coolhue/
推荐指数:★★★☆☆
推荐理由:界面清爽干净,可以一键复制CSS3样式,对程序员非常友好,每个渐变色下方有色值可以直接复制,并且发布了Sketch插件,简直是UI设计神器。
2、WebGradients
网址:https://webgradients.com/
推荐指数:★★★★☆
推荐理由:WebGradients更多是偏向于网页用色,它免费提供180多种渐变配色,你可以将它用在你的网站的背景中,也可以很方便的拷贝CSS,每一个渐变色都有一个好听的名字。直接点击就可以铺满整个屏幕,方便直观地查看它的效果,点击右上角还可以下载png图片,同时提供了PSD和Sketch格式的打包文件,简直不能更贴心了。
3、ColorSpace
网址:https://mycolor.space/
推荐指数:★★★★
推荐理由:它比较有优势的地方就在于可以根据你选定的颜色帮你实时生成配色方案,而且你可以很直观地在网页中看到渐变的生成效果,方便随时调试,让你更有创作的欲望,而不只是直接复制网站提供给你的色值。同时它还有三色渐变可供选择,也有CSS可以直接拷贝,绝对是苦逼设计党的福音。
4、Grabient
网址:https://www.grabient.com/
推荐指数:★★★★☆
推荐理由:可以在画板上方便地调整渐变的方向和两种颜色的占比,这一点相比于其他网站非常新颖,同时提供Sketch打包下载,网站设计的也非常友好。
5、CSS Gradient
网址:https://cssgradient.io/
推荐指数:★★★★
推荐理由:它是所有网站中最方便在线调试的,交互设计的非常友好,支持线性渐变和径向渐变两种,同时还可以调节不透明度和渐变的角度,在网站中调试好可以直接下载图片放入PS或者Sketch中使用,十分方便。同时网站中还有许多关于渐变配色的教程和资讯,可以帮助你快速了解渐变色以及它的正确使用方式,感兴趣的可以学习阅读一下。可能唯一的减分项就是广告有点多,让我这种处女座设计师对它好感度-1。
6、Gradient Hunt
网址:https://gradienthunt.com/popular
推荐指数:★★★★☆
推荐理由:这就是一个单纯的配色推荐网站,汇集了很多好看的线性渐变和径向渐变,相比于上面的网站设计师的自主操控性差了一些,可以将喜欢的渐变点击红心收藏,方便之后查找,看到喜欢的颜色点击跳转可以下载png图片,感觉这一步设计的有点多余,让用户的操作路径变长,后期还有可以优化的空间。
下面是Gal Shir发表于Medium的一篇高赞文章,由我翻译并且整理发布,原文作者是一名产品设计师和艺术总监,以下是他关于渐变色的总结和思考。
色彩是设计中最不容忽视的元素之一,因为设计本身是在不断进化与演化的,所以我们对于色彩的感知也就是我们使用它们的方式,也在随之变化。
我注意到了有一种新的趋势正在设计界悄悄崛起,那就是渐变色的大规模使用,它涵盖了包括UI设计,品牌设计,商业插画,排版印刷等众多的设计领域。人们好像已经对现存于世的颜色感到厌倦了,所以我们开始以一种全新的方式来创造和使用它们。
渐变色在logo和UI中的使用(来自Gleb Kuznetsov)
所谓渐变色是指两种或两种以上的颜色之间的过渡,设计师们可以用渐变创造出全新的颜色,一种前所未有的颜色,它看起来非常的独特,时尚,并且让人眼前一亮。
Instagram的渐变色logo
这会是我们使用颜色的新趋势吗?那些单一的颜色真的已经过时了吗?这些问题只有时间能给我们答案了,因为现在任何的新鲜事物都会被认作是潮流和趋势。然而大部分的潮流和趋势都在随着时间变化,而且很多都已经被时代抛弃,之后Instagram又回换一个什么样的新logo呢?
为什么渐变色流行起来了?
1、渐变让人印象深刻
渐变色是我们在生活中不常见到的东西,所以我们的眼睛会将它视为一种新鲜事物,而设计师的目的正是想让他们的设计作品或者品牌标识深深的留在用户脑海中。我们对于这种不寻常的视觉元素确实要印象深刻一些,因为我们的眼睛还没有适应这种新颜色。日常生活中我们被数量有限并且平淡的颜色所包围,我们对于这些颜色简直太熟悉了,从我们还是个小孩的时候就开始接触他们,而且我们可以一眼认出它们。
我们对于色彩语言的描述,已经被限定在一个特定的感知结构中了,所以如果我们突然看到一些不能被确切描述为“蓝色”或者“紫色”的颜色,我们会记住它,就像我们会记得第一次去到的一个新地方或者是我们品尝到的一个新菜系。
Asana的渐变色logo
2、渐变色很独特
其实说实话,对于想要通过颜色来打造自己品牌独特性的团队来说,现存的颜色貌似不太够。我们能认得出来并且叫得上名字的颜色也就20来种,但是与此同时有成千上万的品牌想要打造他们的识别度。这个时候你就不能选择蓝色了,因为Facebook用了,所以你就换了另一种蓝色,然后你发现已经被Twitter抢占了,所以把这些颜色分给每一个人明显是不够的。
然而渐变色的出现改变了这个局面。设计师可以减弱某些颜色,并且使用渐变色来拓宽可供选择的空间。现在使用蓝紫色渐变的品牌还比较少,所以有机会就此打造专属于自己的品牌识别度。
3、渐变色比较真实
我注意到在现实生活中,一个平面的圆并不常见,我们看到的更多的会是一个球体,我们看到渐变颜色会多于单一的颜色。每一个柠檬都会有它隐藏的一面,更偏棕色一些或者更绿一些。同样的花朵也是,天空也是,很多东西都是。他们都是一种渐变色,或许其实我们在屏幕上看到的渐变色更符合自然逻辑一些。
渐变色在UI中的使用(来自Alper Tornaci)
4、渐变色更加丰富多彩
人们喜欢颜色,当我们在挑选水果和鲜花时很自然地就会被色彩吸引。所以这些大自然的事物们自己创造的,他们让自己变得丰富多彩来吸引人类和动物。所以这是渐变色的另一个闪光点,他们比纯色更多变化,更加有趣,也更吸引人。
—— End ——
原作者:Gal Shir
编译:视觉派Pie
原文链接:
https://medium.muz.li/why-gradients-are-the-new-colors-3d8d42a7a6fc
版权声明:本文在不改变作者愿意的情况下,做了删减和编排,版权属原作者所有。本文仅为翻译,不代表本人观点。
网友评论