⚡ tools.7e.ink
← 返回工具箱
CSS 渐变生成器 / 代码片段生成
可视化生成线性/径向/圆锥渐变 CSS 代码，预设渐变按钮/文字/边框等高频代码片段
🎨 渐变生成器
📦 代码片段
渐变类型
线性渐变 (linear-gradient)
径向渐变 (radial-gradient)
圆锥渐变 (conic-gradient)
角度
90
°
形状
圆形
椭圆
重复渐变
否
是
颜色节点
+ 添加颜色
预览
📋 复制 CSS
💾 保存片段
🎲 随机
生成的 CSS
background: linear-gradient(90deg, #ff6b6b, #4ecdc4);
包含浏览器前缀
完整样式
.gradient-box { width: 300px; height: 200px; background: linear-gradient(90deg, #ff6b6b, #4ecdc4); }
复制完整样式
预设代码片段
我保存的片段