CSS 阴影生成器
可视化调节 CSS 阴影（box-shadow）：拖动滑块调整水平 / 垂直偏移、模糊半径、扩散半径、颜色与不透明度， 实时预览并复制生成好的 CSS 代码，支持内阴影（inset）。全部在浏览器本地计算。
参数调节
预览
预览
CSS 代码
把代码粘贴到元素的 box-shadow 属性即可。
使用说明
box-shadow 的参数组合调起来很费眼，纯靠改数值反复预览效率低。本工具用滑块可视化调节阴影，实时预览并直接给出可复制的 CSS 代码。
- 拖动滑块调整水平 / 垂直偏移、模糊、扩散、颜色与不透明度。
- 勾选「内阴影」切换为 inset 效果，或用预设快速起步。
- 复制生成的 box-shadow 代码粘贴到样式中。
常见问题
- 模拟阴影用几层更好？
- 真实光影通常有多个层次，可叠加多层阴影：一层大模糊做柔光，一层小模糊做接触阴影，效果比单层自然。