渐变生成器

生成线性、径向或锥形渐变,添加色标、调整方向,CSS 代码一键复制。

渐变类型
色标
CSS 代码
调整色标和方向,做出你想要的渐变。

每个渐变都在你的浏览器里渲染,这里设置的内容不会上传到 BroBroGo。

常见问题

线性、径向、锥形渐变有什么区别?

线性渐变让颜色沿着一条直线过渡,方向由角度决定;径向渐变从中心向外扩散,可以是圆形或椭圆;锥形渐变则绕着中心转一圈,像色轮一样。

色标是什么?

每个色标就是固定在渐变某个位置上的一种颜色——起点是 0%,终点是 100%。拖动色标可以改变这种颜色最浓的位置,多加几个色标能让过渡更丰富,最多可以加八个。

怎么控制渐变方向?

线性和锥形渐变的方向由角度滑块控制,0° 朝上,90° 朝右。径向渐变没有角度,改选圆形或椭圆来调整它扩散的样子。