How to Use This Tool 使用说明

1. Select your gradient type: Linear, Radial, or Conic.
2. Add color stops by clicking the "+" button. Each stop has a color picker and position slider.
3. Adjust the gradient angle (for linear) or position (for radial/conic) using the controls.
4. The live preview updates in real-time as you make changes.
5. Click Copy CSS to copy the ready-to-use CSS code to your clipboard.

1. 选择渐变类型：线性、径向或圆锥。
2. 点击 "+" 按钮添加色标。每个色标有取色器和位置滑块。
3. 使用控制器调整渐变角度（线性）或位置（径向/圆锥）。
4. 实时预览会随您的更改即时更新。
5. 点击 Copy CSS 复制可直接使用的 CSS 代码到剪贴板。

Frequently Asked Questions 常见问题

• What is a CSS gradient? — A CSS gradient creates a smooth transition between two or more colors without using images. It reduces page load time and scales perfectly at any resolution.
• What is the difference between linear, radial, and conic? — Linear gradients transition along a straight line (top to bottom, left to right, etc.). Radial gradients transition from a center point outward. Conic gradients transition around a center point like a color wheel.
• Can I use gradients in all browsers? — Yes. CSS gradients are supported in all modern browsers including Chrome, Firefox, Safari, and Edge.

• 什么是 CSS 渐变？ — CSS 渐变在不使用图片的情况下创建两个或多个颜色之间的平滑过渡，减少页面加载时间，在任何分辨率下都能完美缩放。
• 线性、径向和圆锥渐变有什么区别？ — 线性渐变沿直线过渡（从上到下、从左到右等），径向渐变从中心点向外过渡，圆锥渐变围绕中心点像色轮一样过渡。
• 所有浏览器都支持渐变吗？ — 支持。CSS 渐变在所有现代浏览器（Chrome、Firefox、Safari、Edge）中都已得到支持。