CSS 渐变生成器

常见问题
支持哪些 CSS 渐变类型?

本工具支持三种标准 CSS 渐变类型:linear-gradient(线性渐变,颜色沿可配置角度的直线流动)、radial-gradient(径向渐变,颜色从中心点向外辐射成圆形)和 conic-gradient(锥形渐变,颜色围绕中心点旋转,形如色轮或饼图)。生成的 CSS background 属性可在所有现代浏览器中使用。

可以添加两个以上的色标吗?

可以,点击"+ 添加色标"按钮即可添加任意数量的色标。每个色标都有独立的拾色器和 0%–100% 的位置滑块。生成渐变时,色标会自动按位置排序,因此您可以自由调整顺序。色标数量没有上限。

关于 CSS 渐变生成器
CSS 渐变生成器可让您实时可视化构建线性、径向和锥形 CSS 渐变。选择渐变类型,设置角度或方向,然后添加并调整色标(每个色标有独立的颜色和位置)。预览即时更新,生成的 CSS background 属性随时可以复制使用。无需依赖任何外部库,无需上传,一切都在您的浏览器本地运行。