CSS Gradient Generator

什么是 CSS 渐变？

CSS 渐变可以在两种或多种颜色之间创建平滑的颜色过渡。它们通常用作按钮、页头、主视觉区域和装饰元素的背景。使用 linear-gradient() 创建任意角度的直线过渡，或使用 radial-gradient() 创建圆形或椭圆形过渡。

Linear Gradient 与 Radial Gradient 对比

Linear Gradient 沿直线轴延伸——从上到下、从左到右或任意角度。Radial Gradient 从中心点向外辐射，可以是圆形或椭圆形。两种类型都支持任意数量的色标，位置可调。

创建漂亮渐变的技巧

• 最多使用 2–3 种颜色以获得简洁的外观。
• 相似的色调（例如蓝色 → 青色）会产生和谐的效果。
• 不要将色标放得太近，以避免出现生硬的边缘。
• 在不同屏幕尺寸上测试渐变效果。