01  Cool Backgrounds

网站链接：https://coolbackgrounds.io/

网站介绍：Cool Background 是由5个开源生成器整理组成的彩色渐变图像集合在一起的工具集，内置5种不同的背景风格，每一种风格还提供了简单的参数配置。非常的炫酷美观。

低模三角形

粒子

CSS渐变

阶梯渐变

图片

使用方式：左侧选择不规则形状、图形、渐变背景、图片等，右侧可以选择不同的色彩组合，选择适合自己的色彩风格后，点击下载即可。

02 180种渐变背景

网站链接：https://www.fengtupic.com/colortool

网站介绍：内含180种渐变配色方案，特别好看美观，适合各种场景模式下的背景使用。

使用方式：选择适合自己场景的渐变色，可拷贝css格式，也可下载png格式。

03 Pigment

网站链接：https://pigment.shapefactory.co/

网站介绍：可通过改变饱和度、色温和色系改变配色方案，还可通过查看场景效果观察此配色方案呈现效果。

网站截图

饱和度  亮度 颜色

选中和更多

使用方式：左侧可以选择不同的饱和度和亮度，选择其他色调，右侧放大可查看场景配色效果。

04 ColorSpace

网站链接：https://mycolor.space/

网站介绍：Color Space 是一款非常实用的渐变生成器，我们只需要选择一个颜色，就可以快速生成20-30种不同风格的配色方案。同时还提供了梯度和三色渐变选项，可以快速生成配色并查看 CSS 代码。

网站截图

输入颜色代码或选择颜色

生成方案

更多与修改

CSS代码模式

三色渐变

使用方式：上面输入色值，自动出来渐变方案，还可左右滑动选择适合自己的搭配方案

05 Adobe Color

网站链接：https://color.adobe.com/zh/create/color-wheel

网站介绍：可自由选择色环上不同的颜色值，依照类比、单色、三原色、补色等不同搭配模式进行搭配，下面展示一系列色值。同时可将看到的好的图片色纸上传上来，自动配比色值，同时，还能查看背景色与文字的对比度检测，非常适合网站多色搭配。

色轮

辅助工具

使用方式：滑动多tab滑块，选择色环颜色做不同类型搭配；利用协助工具查看文字与背景的对比检测。

06 BrandColors

网站链接：https://brandcolors.net/

网站介绍：这个网站是基于最大的官方品牌颜色做整理，包含了众多品牌颜色官网的配色方案，可作为网站或者品牌配色的借鉴。

颜色方案

选中后复制下载

使用方式：选择好相关品牌的色彩调性，可查看色值，可复制色值，也可以下载相关色值，超级方便。

07 Color Leap

网站链接：https://colorleap.app/home

网站介绍：一键生成复古风图片色调分离，可以选择年代搜索过去180种配色方案。

年份选择

年份列表

代表图片和查看颜色

查看颜色和查看图片

使用方式：选择年代，选择图片风格的配色方案，查看颜色，复制相关色调即可。

08 ColorBox

网站链接：https://www.colorbox.io/

网站介绍：ColorBox 是选择一个颜色，会生成一个颜色系列的颜色工具。可以帮助我们轻松地创建非常炫酷的色彩集，配色页面还有大量的个性化选项，满足我们的任何需求。

网站截图

饱和

使用方式：左侧可以添加不同的颜色分类值，右侧调整搭配的颜色系列和同色系和补色系不同选择，曲线直观展示出色调和饱和度的变化幅度。

09 Eggradients

网站链接：https://www.eggradients.com/

网站介绍：Eggradients 是一款收录了最新设计趋势渐变色彩的配色网站，以鸡蛋的形式展现，支持一键复制。

预选颜色

渐变调色板

使用方式：选择适合自己设计场景的配色方案，复制即可。

10 CoolHue 2.0

网站链接：https://webkul.github.io/coolhue/sketch-plugin/

网站介绍：CoolHue 2.0是一款免费的 Sketch 渐变配色插件和收集工具。

使用方式：在sketch下载插件，直接点击插件，选择相关配色。

11 Free Mesh Gradient Collection

网站链接：https://www.ls.graphics/meshgradients

网站介绍：包含100多个免费的渐变色合集，支持 Sketch、PNG、AI、JPG、EPS 等多种格式下载。

网站截图

翻译截图

渐变截图

使用方式：可选择ai、eps、jpg、png格式，选择好看的渐变色下载即可。

12 Grabient

网站链接：https://www.grabient.com/

网站介绍：Grabient 一个非常漂亮且实用的渐变网站，支持 CSS 样式代码复制、360度渐变旋转、自由增加或删除渐变颜色等功能。

网站截图

调整角度

调整颜色

渐变比例

使用方式：选择适合自己风格的配色方案，点开调整渐变梯度，下载即可。

转载请注明：学UI网》12种超级好用的-免费渐变神器

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码蓝小助，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、

UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司