CSS 高级阴影 & 渐变生成器
支持多层阴影叠加、Tailwind 代码生成及实时预览
预览物体设置
图层 1
水平偏移 (X)0px
垂直偏移 (Y)4px
模糊 (Blur)14px
扩展 (Spread)0px
不透明度0.1
#000000
图层 2
水平偏移 (X)0px
垂直偏移 (Y)10px
模糊 (Blur)30px
扩展 (Spread)0px
不透明度0.05
#000000
如何使用 CSS 生成器？
- 1在左侧侧边栏调节各个属性（阴影位移、模糊度、渐变颜色等）。
- 2点击“添加层”可以叠加多层阴影，实现更细腻的设计效果。
- 3通过屏幕中央的实时预览区域查看调整后的视觉表现。
- 4最后点击“复制样式”，您可以选择原生 CSS 或 Tailwind 代码。
CSS 生成器常见问题
支持哪些 CSS 属性？
目前支持 Box Shadow (多层阴影) 和 Background Gradient (线性/径向渐变)，后续会加入动画和文字效果。
Tailwind 代码是 JIT 格式吗？
是的，对于自定义值，我们会生成 `shadow-[...]` 形式的代码，直接复制到您的 Tailwind 项目中即可生效。