CSS颜色渐变合集

001 温暖的火焰

欢迎来到imuer视界！！！
代码：

#ff9a9e→#fad0c4

background-image: linear-gradient(45deg, rgb(255, 154, 158) 0%, rgb(250, 208, 196) 99%, rgb(250, 208, 196) 100%);
​

002 褪色的夕阳

欢迎来到imuer视界！！！
代码：

#a18cd1→#fbc2eb

background-image: linear-gradient(to top, rgb(161, 140, 209) 0%, rgb(251, 194, 235) 100%);
​

003 春天的温暖

欢迎来到imuer视界！！！
代码：

#fad0c4→#fad0c4

background-image: linear-gradient(to top, rgb(250, 208, 196) 0%, rgb(250, 208, 196) 1%, rgb(255, 209, 255) 100%);
​

004 美味的水蜜桃

欢迎来到imuer视界！！！
代码：

#ffecd2→#fcb69f

background-image: linear-gradient(to right, rgb(255, 236, 210) 0%, rgb(252, 182, 159) 100%);
​

005 年轻的激情

欢迎来到imuer视界！！！
代码：

Many colors

background-image: linear-gradient(to right, rgb(255, 129, 119) 0%, rgb(255, 134, 122) 0%, rgb(255, 140, 127) 21%, rgb(249, 145, 133) 52%, rgb(207, 85, 108) 78%, rgb(177, 42, 91) 100%);
​

006 女士的嘴唇

欢迎来到imuer视界！！！
代码：

#ff9a9e→#fecfef

background-image: linear-gradient(to top, rgb(255, 154, 158) 0%, rgb(254, 207, 239) 99%, rgb(254, 207, 239) 100%);
​

007 阳光明媚的早晨

欢迎来到imuer视界！！！
代码：

#f6d365→#fda085

background-image: linear-gradient(120deg, rgb(246, 211, 101) 0%, rgb(253, 160, 133) 100%);
​

008 夕阳下的雨

欢迎来到imuer视界！！！
代码：

#fbc2eb→#a6c1ee

background-image: linear-gradient(to top, rgb(251, 194, 235) 0%, rgb(166, 193, 238) 100%);
​

009 梦想被冷冻

欢迎来到imuer视界！！！
代码：

#fdcbf1→#e6dee9

background-image: linear-gradient(to top, rgb(253, 203, 241) 0%, rgb(253, 203, 241) 1%, rgb(230, 222, 233) 100%);
​

010 冬季的哈尔滨湖

欢迎来到imuer视界！！！
代码：

#a1c4fd→#c2e9fb

background-image: linear-gradient(120deg, rgb(161, 196, 253) 0%, rgb(194, 233, 251) 100%);
​

011 尘埃的草

欢迎来到imuer视界！！！
代码：

#d4fc79→#96e6a1

background-image: linear-gradient(120deg, rgb(212, 252, 121) 0%, rgb(150, 230, 161) 100%);
​

012 诱人的蔚蓝

欢迎来到imuer视界！！！
代码：

#84fab0→#8fd3f4

background-image: linear-gradient(120deg, rgb(132, 250, 176) 0%, rgb(143, 211, 244) 100%);
​

013 大雨滂沱

欢迎来到imuer视界！！！
代码：

#cfd9df→#e2ebf0

background-image: linear-gradient(to top, rgb(207, 217, 223) 0%, rgb(226, 235, 240) 100%);
​

014 我心爱的人

欢迎来到imuer视界！！！
代码：

#a6c0fe→#f68084

background-image: linear-gradient(120deg, rgb(166, 192, 254) 0%, rgb(246, 128, 132) 100%);
​

015 结出的果实

欢迎来到imuer视界！！！
代码：

#fccb90→#d57eeb

background-image: linear-gradient(120deg, rgb(252, 203, 144) 0%, rgb(213, 126, 235) 100%);
​

016 深蓝色

欢迎来到imuer视界！！！
代码：

#e0c3fc→#8ec5fc

background-image: linear-gradient(120deg, rgb(224, 195, 252) 0%, rgb(142, 197, 252) 100%);
​

017 成熟的女性

欢迎来到imuer视界！！！
代码：

#f093fb→#f5576c

background-image: linear-gradient(120deg, rgb(240, 147, 251) 0%, rgb(245, 87, 108) 100%);
​

018 多云的深圳

欢迎来到imuer视界！！！
代码：

#fdfbfb→#ebedee

background-image: linear-gradient(120deg, rgb(253, 251, 251) 0%, rgb(235, 237, 238) 100%);
​

019 三亚的海滩

欢迎来到imuer视界！！！
代码：

#4facfe→#00f2fe

background-image: linear-gradient(to right, rgb(79, 172, 254) 0%, rgb(0, 242, 254) 100%);
​

020 新的生活

欢迎来到imuer视界！！！
代码：

#43e97b→#38f9d7

background-image: linear-gradient(to right, rgb(67, 233, 123) 0%, rgb(56, 249, 215) 100%);
​

021 已是近黄昏

欢迎来到imuer视界！！！
代码：

#fa709a→#fee140

background-image: linear-gradient(to right, rgb(250, 112, 154) 0%, rgb(254, 225, 64) 100%);
​

022 入睡的简室

欢迎来到imuer视界！！！
代码：

#30cfd0→#330867

background-image: linear-gradient(to top, rgb(48, 207, 208) 0%, rgb(51, 8, 103) 100%);
​

023 罕见的风力

欢迎来到imuer视界！！！
代码：

#a8edea→#fed6e3

background-image: linear-gradient(to top, rgb(168, 237, 234) 0%, rgb(254, 214, 227) 100%);
​

024 近水楼台先得月

欢迎来到imuer视界！！！
代码：

#5ee7df→#b490ca

background-image: linear-gradient(to top, rgb(94, 231, 223) 0%, rgb(180, 144, 202) 100%);
​

025 野外的苹果

欢迎来到imuer视界！！！
代码：

#d299c2→#fef9d7

background-image: linear-gradient(to top, rgb(210, 153, 194) 0%, rgb(254, 249, 215) 100%);
​

026 上海的外滩

欢迎来到imuer视界！！！
代码：

#f5f7fa→#c3cfe2

background-image: linear-gradient(135deg, rgb(245, 247, 250) 0%, rgb(195, 207, 226) 100%);
​

027 厦门的微笑

欢迎来到imuer视界！！！
代码：

Many colors

background-image: radial-gradient(248px at center center, rgb(22, 217, 227) 0%, rgb(48, 199, 236) 47%, rgb(70, 174, 247) 100%);
​

028 紫色的盘子

欢迎来到imuer视界！！！
代码：

#667eea→#764ba2

background-image: linear-gradient(135deg, rgb(102, 126, 234) 0%, rgb(118, 75, 162) 100%);
​

029 基业长青的天空

欢迎来到imuer视界！！！
代码：

#fdfcfb→#e2d1c3

background-image: linear-gradient(135deg, rgb(253, 252, 251) 0%, rgb(226, 209, 195) 100%);
​

030 快乐的渔夫

欢迎来到imuer视界！！！
代码：

#89f7fe→#66a6ff

background-image: linear-gradient(120deg, rgb(137, 247, 254) 0%, rgb(102, 166, 255) 100%);
​

031 对你的祝福

欢迎来到imuer视界！！！
代码：

#fddb92→#d1fdff

background-image: linear-gradient(to top, rgb(253, 219, 146) 0%, rgb(209, 253, 255) 100%);
​

032 鹰的漂亮眼睛

欢迎来到imuer视界！！！
代码：

#9890e3→#b1f4cf

background-image: linear-gradient(to top, rgb(152, 144, 227) 0%, rgb(177, 244, 207) 100%);
​

033 九寨沟的湖底

欢迎来到imuer视界！！！
代码：

#ebc0fd→#d9ded8

background-image: linear-gradient(to top, rgb(235, 192, 253) 0%, rgb(217, 222, 216) 100%);
​

034 熟还是不熟的柠檬

欢迎来到imuer视界！！！
代码：

#96fbc4→#f9f586

background-image: linear-gradient(to top, rgb(150, 251, 196) 0%, rgb(249, 245, 134) 100%);
​

035 天地相接

欢迎来到imuer视界！！！
代码：

#2af598→#009efd

background-image: linear-gradient(rgb(42, 245, 152) 0%, rgb(0, 158, 253) 100%);
​

036 李白的奇迹

欢迎来到imuer视界！！！
代码：

#cd9cf2→#f6f3ff

background-image: linear-gradient(to top, rgb(205, 156, 242) 0%, rgb(246, 243, 255) 100%);
​

037 旧式的

欢迎来到imuer视界！！！
代码：

Many colors

background-image: linear-gradient(to right, rgb(228, 175, 203) 0%, rgb(184, 203, 184) 0%, rgb(184, 203, 184) 0%, rgb(226, 197, 139) 30%, rgb(194, 206, 156) 64%, rgb(126, 219, 220) 100%);
​

038 高级葡萄酒

欢迎来到imuer视界！！！
代码：

Many colors

background-image: linear-gradient(to right, rgb(184, 203, 184) 0%, rgb(184, 203, 184) 0%, rgb(180, 101, 218) 0%, rgb(207, 108, 201) 33%, rgb(238, 96, 156) 66%, rgb(238, 96, 156) 100%);
​

039 深蓝的海

欢迎来到imuer视界！！！
代码：

#6a11cb→#2575fc

background-image: linear-gradient(to right, rgb(106, 17, 203) 0%, rgb(37, 117, 252) 100%);
​

040 致命的一击

欢迎来到imuer视界！！！
代码：

Many colors

background-color: rgb(220, 217, 212); background-image: linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), radial-gradient(at 50% 0%, rgba(255, 255, 255, 0.1) 0%, rgba(0, 0, 0, 0.5) 50%); background-blend-mode: soft-light, screen;
​

041 酸酸甜甜就是我

欢迎来到imuer视界！！！
代码：

#37ecba→#72afd3

background-image: linear-gradient(to top, rgb(55, 236, 186) 0%, rgb(114, 175, 211) 100%);
​

042 悲伤的松树

欢迎来到imuer视界！！！
代码：

#ebbba7→#cfc7f8

background-image: linear-gradient(to top, rgb(235, 187, 167) 0%, rgb(207, 199, 248) 100%);
​

043 青岛的美美哒

欢迎来到imuer视界！！！
代码：

#fff1eb→#ace0f9

background-image: linear-gradient(to top, rgb(255, 241, 235) 0%, rgb(172, 224, 249) 100%);
​

044 害羞的彩虹

欢迎来到imuer视界！！！
代码：

Many colors

background-image: linear-gradient(to right, rgb(238, 162, 162) 0%, rgb(187, 193, 191) 19%, rgb(87, 198, 225) 42%, rgb(180, 159, 218) 79%, rgb(122, 197, 216) 100%);
​

045 山脊里的洞

欢迎来到imuer视界！！！
代码：

Many colors

background: linear-gradient(rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at center top, rgba(255, 255, 255, 0.4) 0%, rgba(0, 0, 0, 0.4) 120%) rgb(152, 152, 152); background-blend-mode: multiply, multiply;
​

046 很多的希望

欢迎来到imuer视界！！！
代码：

#c471f5→#fa71cd

background-image: linear-gradient(to top, rgb(196, 113, 245) 0%, rgb(250, 113, 205) 100%);
​

047 我要飞的更高

欢迎来到imuer视界！！！
代码：

#48c6ef→#6f86d6

background-image: linear-gradient(to top, rgb(72, 198, 239) 0%, rgb(111, 134, 214) 100%);
​

048 强烈的幸福来袭

欢迎来到imuer视界！！！
代码：

Many colors

background-image: linear-gradient(to right, rgb(247, 140, 160) 0%, rgb(249, 116, 143) 19%, rgb(253, 134, 140) 60%, rgb(254, 154, 139) 100%);
​

049 未成熟的果实

欢迎来到imuer视界！！！
代码：

#feada6→#f5efef

background-image: linear-gradient(to top, rgb(254, 173, 166) 0%, rgb(245, 239, 239) 100%);
​

050 北方大雪纷飞

欢迎来到imuer视界！！！
代码：

#e6e9f0→#eef1f5

background-image: linear-gradient(to top, rgb(230, 233, 240) 0%, rgb(238, 241, 245) 100%);
​

051 淡淡的水墨丹青

欢迎来到imuer视界！！！
代码：

#accbee→#e7f0fd

background-image: linear-gradient(to top, rgb(172, 203, 238) 0%, rgb(231, 240, 253) 100%);
​

052 仁慈而又坚强

欢迎来到imuer视界！！！
代码：

#e9defa→#fbfcdb

background-image: linear-gradient(-20deg, rgb(233, 222, 250) 0%, rgb(251, 252, 219) 100%);
​

053 柔软的小嫩草

欢迎来到imuer视界！！！
代码：

#c1dfc4→#deecdd

background-image: linear-gradient(to top, rgb(193, 223, 196) 0%, rgb(222, 236, 221) 100%);
​

054 浓郁的树叶

欢迎来到imuer视界！！！
代码：

#0ba360→#3cba92

background-image: linear-gradient(to top, rgb(11, 163, 96) 0%, rgb(60, 186, 146) 100%);
​

055 百度的蓝色

欢迎来到imuer视界！！！
代码：

#00c6fb→#005bea

background-image: linear-gradient(to top, rgb(0, 198, 251) 0%, rgb(0, 91, 234) 100%);
​

056 阴凉的水

欢迎来到imuer视界！！！
代码：

#74ebd5→#9face6

background-image: linear-gradient(to right, rgb(116, 235, 213) 0%, rgb(159, 172, 230) 100%);
​

057 这个妆画的挫

欢迎来到imuer视界！！！
代码：

#6a85b6→#bac8e0

background-image: linear-gradient(to top, rgb(106, 133, 182) 0%, rgb(186, 200, 224) 100%);
​

058 大鲸鱼

欢迎来到imuer视界！！！
代码：

#a3bded→#6991c7

background-image: linear-gradient(to top, rgb(163, 189, 237) 0%, rgb(105, 145, 199) 100%);
​

059 少年的笔记

欢迎来到imuer视界！！！
代码：

#9795f0→#fbc8d4

background-image: linear-gradient(to top, rgb(151, 149, 240) 0%, rgb(251, 200, 212) 100%);
​

060 善意的谎言

欢迎来到imuer视界！！！
代码：

#a7a6cb→#8989ba

background-image: linear-gradient(to top, rgb(167, 166, 203) 0%, rgb(137, 137, 186) 52%, rgb(137, 137, 186) 100%);
​

相关链接

CSS 线性渐变