Dear color lovers – together, we’ll have a more colorful future. Support us on

颜色渐变

概述

可能的应用

所有已发布的渐变色一目了然。使用名称过滤器,并根据不同的标准进行排序。评出最漂亮的渐变效果,并根据最匹配的颜色创建自己的渐变效果。

显示选项

1
2
3
4
5
6
7
8
9
10
11
0

#BA5918 - #8C4719 - #5D188B - #871FCC


CSS 代码:

background-image: linear-gradient(118deg, #BA5918 0%,#8C4719 29%,#5D188B 85%,#871FCC 100%);

0

#482CA6 - #1220D9 - #7D3873 - #E74F0D - #2D26C0 - #2023CD - #1220D9


CSS 代码:

background-image: radial-gradient(circle closest-side , #482CA6 0%,#1220D9 16%,#7D3873 26%,#E74F0D 63%,#2D26C0 74%,#2023CD 90%,#1220D9 95%);

0

#D0C6B4 - #2F394B


CSS 代码:

background-image: radial-gradient(circle at 49% center, #D0C6B4 11%,#2F394B 64%);

0

#FF9E18 - #CC7700


CSS 代码:

background-image: radial-gradient(circle at 16% 52%, #FF9E18 2%,#CC7700 91%);

0

#B8B799 - #C8C8C7


CSS 代码:

background-image: linear-gradient(28deg, #B8B799 9%,#C8C8C7 73%);

0

#0080C8 - #00001E


CSS 代码:

background-image: linear-gradient(246deg, #0080C8 0%,#00001E 100%);

0

#E74F0D - #7D3873 - #482CA6 - #2D26C0 - #2023CD - #1220D9


CSS 代码:

background-image: radial-gradient(circle , #E74F0D 0%,#7D3873 27%,#482CA6 46%,#2D26C0 63%,#2023CD 79%,#1220D9 100%);

0

#00FF91 - #40CD90 - #30DA91 - #20E691 - #68AD8F - #50C090 - #7F9A8E - #FD348A


CSS 代码:

background-image: radial-gradient(circle at 49% 53%, #00FF91 44%,#40CD90 44%,#30DA91 51%,#20E691 51%,#68AD8F 56%,#50C090 56%,#7F9A8E 65%,#FD348A 89%);

0

#FFAA4D - #FF7F41


CSS 代码:

background-image: radial-gradient(circle , #FFAA4D 8%,#FF7F41 86%);

0

#F4F6F1 - #6CA6C4


CSS 代码:

background-image: linear-gradient(246deg, #F4F6F1 0%,#6CA6C4 100%);

0

#00426A - #0092AB


CSS 代码:

background-image: linear-gradient(0deg, #00426A 0%,#0092AB 100%);

0

Blue Eyeball


CSS 代码:

background-image: radial-gradient(circle at 59% 42%, #030303 10%,#477C94 13%,#84C3E0 21%,#549FBA 31%,#507E8A 35%,#F0C5D6 38%,#DB9AA4 73%,#B84F5B 77%);

0

Purple Eyeball


CSS 代码:

background-image: radial-gradient(circle at 59% 42%, #030303 10%,#6D2F7D 13%,#BD76DB 21%,#8F44A6 31%,#622073 35%,#F0C5D6 38%,#DB9AA4 73%,#B84F5B 77%);

0

Green Eyeball


CSS 代码:

background-image: radial-gradient(circle at 59% 41%, #131414 0%,#1A1915 13%,#0FA833 16%,#389C54 22%,#1A7D2E 28%,#255229 32%,#2D3618 34%,#F5C9CA 37%,#E0B4B4 67%,#B55B5B 80%);

0

Vida Lactea


CSS 代码:

background-image: linear-gradient(347deg, #003E51 0%,#FFA300 100%);

0

#A48F7A - #9B8A70


CSS 代码:

background-image: linear-gradient(100deg, #A48F7A 2%,#9B8A70 97%);

0

#D2D246 - #A1C091 - #70ADDB


CSS 代码:

background-image: linear-gradient(360deg, #D2D246 12%,#A1C091 31%,#70ADDB 52%);

0

#F9F9F7 - #779ACE - #5986CC


CSS 代码:

background-image: linear-gradient(0deg, #F9F9F7 10%,#779ACE 81%,#5986CC 93%);

0

#B2C216 - #CB3E50


CSS 代码:

background-image: linear-gradient(31deg, #B2C216 16%,#CB3E50 80%);

0

#F8AC1D - #D95995


CSS 代码:

background-image: linear-gradient(19deg, #F8AC1D 17%,#D95995 86%);

0

#F14997 - #061C125E - #FCFCFC


CSS 代码:

background-image: radial-gradient(circle at 61% 29%, #F14997 21%,#061C125E 47%,#FCFCFC 85%);

0

#9B8A70 - #E3D9C7


CSS 代码:

background-image: linear-gradient(227deg, #9B8A70 1%,#E3D9C7 97%);

0

#9B8A70 - #E4D2B7


CSS 代码:

background-image: linear-gradient(27deg, #9B8A70 2%,#E4D2B7 96%);

0

#EFEEE5 - #B7A99C


CSS 代码:

background-image: linear-gradient(90deg, #EFEEE5 0%,#B7A99C 95%);

0

eye


CSS 代码:

background-image: radial-gradient(circle at 63% 19%, #F14997 12%,#061C125E 61%,#FCFCFC 86%);

验证您作为制造商的调色板!

为设计师和代理商提供精确的色值。

我们走

显示屏

1
2
3
4
5
6
7
8
9
10
11

您必须登录后才能保存调色板。

登录您的账户

创建账户

分享当前的调色板
是公开的还是私人的?
分享后会有链接。

取消 分享

共享调色板
请复制并保存所需的链接。

分享

好的,我复制了链接

您的颜色会保存在一个新的调色板中。
在您的个人档案中查看它们。
您可以进一步自定义并共享它们。

显示调色板
关闭

创建调色板

下载以各种格式下载

全部删除

点击 可以创建调色板并下载 色板。