CSS阴影生成器简介

CSS阴影生成器是一款在线可视化编辑工具，支持box-shadow（元素阴影）、text-shadow（文字阴影）、drop-shadow（图标投影）三种类型。

功能特点：可视化调整X/Y偏移、模糊半径、扩散半径、内阴影、颜色透明度调节、内置Material Design标准阴影预设、一键复制CSS代码。

适用于网页卡片、按钮、输入框、文字特效、透明PNG/SVG图标投影等场景。所有操作在本地完成，生成的CSS代码可直接复制到项目中。

如何使用本工具？

1. 选择阴影类型（box-shadow/text-shadow/drop-shadow）。

2. 调节X/Y偏移、模糊、颜色等参数。

3. 点击"内阴影"可切换为inset阴影效果。

4. 使用预设快速应用Material Design标准阴影或Neumorphism效果。

常见问题与解答

三种阴影类型的区别？

box-shadow适用于矩形元素（卡片、按钮）；text-shadow仅作用于文字；drop-shadow跟随实际像素轮廓，适合透明PNG/SVG图标。

Material Design阴影有什么特点？

Material阴影由多层叠加组成，比单层阴影更真实。本工具内置1dp/4dp/8dp等标准值，可直接复制使用。

最新工具