今天的推文是之前答应大家的配色网站分享

文中提到的所有网站

基本上都是小编经常在用的

就觉得还蛮好用的

真诚地分享给大家

这些网站里有纯色配色网站,也有渐变色网站,大家可以根据自己的喜好选择适合自己的哦~言外之意就是,我觉得好用但你不一定觉得好用,如果你觉得不好用,那请别杠……谢谢

纯色配色网站

1

https://colordrop.io/

网站常见的配色(10个超级好用的配色网站)(1)

这个网站主要以四宫格颜色为一组配色,选择自己喜欢的一组颜色点击,然后在页面右边会显示每个颜色的颜色值:

网站常见的配色(10个超级好用的配色网站)(2)

2

https://colorhunt.co/

网站常见的配色(10个超级好用的配色网站)(3)

这个网站的配色也是以四个颜色为一组,但它对配色有进行分类:

网站常见的配色(10个超级好用的配色网站)(4)

3

http://zhongguose.com/

网站常见的配色(10个超级好用的配色网站)(5)

这个网站的颜色主要是一些中国传统色,每种颜色都有命名。然后,同色系的颜色是摆在一起的,所以用来做同色系配色也蛮好用的:

网站常见的配色(10个超级好用的配色网站)(6)

4

https://www.happyhues.co/

网站常见的配色(10个超级好用的配色网站)(7)

之前和咱们粉丝聊天时,她说直接拿到一组配色,完全不知道哪个颜色适合做背景,哪个颜色适合做点缀,就不太适合新手小白。

那这个网站呢,除了有配色方案,它还会给一张图片,图片的配色会根据配色方案来显示,所以颜色比例会比较直观。

网站常见的配色(10个超级好用的配色网站)(8)

然后在图片的下方,会有颜色值,注明了哪个颜色可以用作背景,哪个颜色可以用作高亮等,大家就可以参考着来完成自己的配色。

网站常见的配色(10个超级好用的配色网站)(9)

5

https://mycolor.space/

网站常见的配色(10个超级好用的配色网站)(10)

这个网站既可以提供纯色配色方案,也可以自主调整渐变色。

点击紫色按钮,选择一个颜色,再点下方的GENERATE生成按钮,页面往下滑,就会看到一些以该颜色生成的配色方案:

网站常见的配色(10个超级好用的配色网站)(11)

然后,我们可以点页面右上角第二个入口GRADIENT进入两种颜色渐变设置页面,第三个入口3-COLOR-GRADIENT是三种颜色渐变设置页面,两者的操作是一样的。

网站常见的配色(10个超级好用的配色网站)(12)

渐变色网站

1

http://gradientsguru.com/

这个网站都是现成的渐变色,找到自己喜欢的渐变色,点右上角的复制图标,复制颜色代码。

网站常见的配色(10个超级好用的配色网站)(13)

2

https://webgradients.com/

这也是一个现成的渐变色网站,点颜色圆圈右下角的Copy CSS可以复制渐变色颜色代码

网站常见的配色(10个超级好用的配色网站)(14)

3

https://cssgradient.io/

网站常见的配色(10个超级好用的配色网站)(15)

这个网站可以用来调渐变色,颜色长条一左一右的两个滑块可以左右滑动,调整颜色的区域:

网站常见的配色(10个超级好用的配色网站)(16)

鼠标点击长条中间任意位置,可以添加颜色:

网站常见的配色(10个超级好用的配色网站)(17)

调色区域下方可以选择线性渐变还是径向渐变,以及设置渐变角度:

网站常见的配色(10个超级好用的配色网站)(18)

4

https://www.css-gradient.com/

网站常见的配色(10个超级好用的配色网站)(19)

这个网站也是用来自主调渐变色的,主要是两种颜色渐变。

颜色可以自己选择,还可以设置径向渐变和线性渐变,也可以设置渐变角度:

网站常见的配色(10个超级好用的配色网站)(20)

5

https://www.grabient.com/

网站常见的配色(10个超级好用的配色网站)(21)

这个网站虽然有现成的渐变色,但我觉得更适合用它来自主调整渐变色。

它默认的有两色或三色渐变,点渐变色显示区域下面的加号可以自主增加渐变的颜色,点颜色圆圈可以修改颜色,想要删掉颜色拖动到加号即可删掉:

网站常见的配色(10个超级好用的配色网站)(22)

点左下角的角度图标,再用鼠标沿圆环转动,可以调整渐变角度:

网站常见的配色(10个超级好用的配色网站)(23)

好啦~

以上就是今天的全部内容

如果你们有其他用起来比较好的配色网站

也欢迎在留言里发出来讨论一下哦~

,