[分享]css3各色渐变代码

CSS3中渐变的出现，让页面的布局更加丰富多彩，下面介绍几个不同的颜色渐变的CSS3代码段：

.linear-gradient {
  background: linear-gradient(to right, #00E676, #009688);
}

这是一个从左到右的线性渐变，起始颜色是#00E676，结束颜色是#009688。

.radial-gradient {
  background: radial-gradient(ellipse at center, #F44336, #E91E63, #9C27B0);
}

这是一个径向渐变，以椭圆形形状放置于元素的中心，呈现从#F44336到#E91E63再到#9C27B0的过渡效果。

.repeating-gradient {
  background: repeating-linear-gradient(to right, #4FC3F7, #4FC3F7 25%, #455A64 25%, #455A64 50%);
}

这是一个重复线性渐变，从左到右渐变，以#4FC3F7为起始色，每25%透明度递增一次，直到透明度为100%后用#455A64替代渐变色，并且每50%重复渲染。

.conic-gradient {
  background: conic-gradient(#F9A825, #F44336, #E91E63, #9C27B0, #3F51B5, #2196F3, #4CAF50, #F9A825);
}

这是一个从中心点开始的锥形渐变，起始色是#F9A825，之后呈现一组颜色环，每个颜色环之间的角度相等，之后渐变到结束色#F9A825。

以上是比较常见的几种颜色渐变的CSS3代码段，大家可以根据需要选择合适的样式应用到页面中去。