Grabient 在线渐变配色网站，交互操作超方便

分享推荐一个渐变配色灵感的网站:Grabient，这个网站的交互体验还真不错！如果你还在为你自己设置的渐变配色不好看，不妨去看看这网站，这里面有很多不错的渐变配色方案，拥有它可以方便实现漂亮的渐变效果。

<img src=“https://assets.moshanghua.net/images/msh-1539-01.png” alt=“Grabient首页” />

网站名称：Grabient
网站地址：https://www.grabient.com/
<br >
<h2>网站特色</h2>
<ul>
<ol>支持 CSS 样式代码复制</ol>

<ol>可以操控360度渐变旋转</ol>

<ol>自由增加或删除渐变颜色</ol>

<ol>超方便的交互操作</ol>
</ul>
<br >
下面我们来看看这个交互体验不错的配色网站，试过之后相信你会喜欢上它！

<img src=“https://assets.moshanghua.net/images/msh-1539-02.png” alt=“Grabient内容页” />

<h2>渐变角度变换</h2>

点击左下角「90度」图案，就可以操控渐变的角度哦！

<img src=“https://assets.moshanghua.net/images/msh-1539-03.gif” alt=“渐变角度变换演示” />

<h2>增加配色</h2>

这个作品相当简单，点击加号就可以，同时还能选择颜色。

<img src=“https://assets.moshanghua.net/images/msh-1539-04.gif” alt=“增加配色演示” />

<h2>改变渐变范围</h2>

点击右下角设备图标，就可以通过拖动来设置渐变范围了，是不是很方便？

<img src=“https://assets.moshanghua.net/images/msh-1539-05.gif” alt=“改变渐变范围演示” />

<h2>删除色块</h2>

按信一个色块，然后向右拖动到「垃圾桶」图标即可。

<img src=“https://assets.moshanghua.net/images/msh-1539-06.gif” alt=“删除色块演示” />

<h2>切换颜色模式</h2>

比如 HSL，RGB，HEX 之间切换

<img src=“https://assets.moshanghua.net/images/msh-1539-07.png” alt=“切换颜色模式演示” />

<h2>复制 CSS 代码</h2>

只要点击一下就能复制 CSS 代码……

<img src=“https://assets.moshanghua.net/images/msh-1539-08.png” alt=“复制 CSS 代码演示” />

关于在线配色网站

Grabient 网站目前已精选20+优秀的在线配色网站，各有各特色，需要配色灵感的时候，可以去查找灵感哦！个人感觉还是不错的！