CSS 渐变生成器:可视化调节线性/径向渐变的角度、色标与透明度,实时预览并生成 CSS 代码。
适用场景
- 设计网页背景、按钮的渐变效果并拿到现成 CSS
- 理解 linear-gradient 的角度与色标语义
- 探索多色标复杂渐变(mesh 风格近似)
常见问题
为什么渐变角度 180deg 是"从上到下"?
CSS 渐变角度以"指向"为语义:0deg 指向上,90deg 指向右,180deg 指向下。渐变沿指定方向从起始色标过渡到结束色标。
渐变文字怎么做?
background 设渐变后,配合 -webkit-background-clip: text 与 text transparency 让文字透出背景渐变。工具生成背景部分,裁剪属性按需附加。