CSS 阴影生成
可视化调整 box-shadow 参数，实时预览阴影效果，一键复制 CSS 代码。
预览
参数
水平偏移 (px)
垂直偏移 (px)
模糊 (px)
扩散 (px)
颜色
不透明度
生成 CSS
工具介绍
本工具是一款面向前端工程师的免费在线 CSS box-shadow 生成器。CSS 的 box-shadow 属性用于为元素添加一个或多个阴影效果，每个阴影由水平偏移（offset-x）、垂直偏移（offset-y）、模糊半径（blur）、扩散半径（spread）和颜色组成；可选关键字 inset 表示内阴影。本工具支持通过滑块和取色器可视化调整上述所有参数，在预览框中实时查看效果，并一键复制生成的 CSS 代码（如 box-shadow: 0 8px 24px 0 rgba(0,0,0,0.15);）到样式表或内联样式中使用。无需安装，所有操作均在浏览器内完成。
使用说明
1. 调整参数：通过滑块或数字输入框设置水平偏移、垂直偏移、模糊半径和扩散半径；使用取色器或输入 HEX 色值（如 #000000）选择阴影颜色，并设置不透明度（0–1）。需要内阴影时勾选「内阴影」。
2. 预览效果：上方示例框会随参数变化实时更新，便于在复制前确认效果。
3. 复制代码：确认满意后点击「复制代码」，将生成的 box-shadow CSS 复制到剪贴板，再粘贴到你的 CSS 文件或内联样式中（如用于卡片、按钮等元素）即可。