Box Shadow 生成
可视化调节参数，生成 CSS box-shadow 代码
功能介绍
拖动滑杆调节偏移、模糊、扩散与透明度，实时预览阴影效果并生成 CSS 代码，支持内外阴影切换与多层阴影叠加。
使用说明
- 调节水平/垂直偏移、模糊半径、扩散半径与颜色透明度
- 勾选 inset 切换内阴影
- 「添加一层」可叠加多层阴影（逗号分隔）
输入输出示例
生成结果示例
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);常见问题
多层阴影的绘制顺序是什么？
先声明的阴影绘制在最上层，调试时注意层级关系。
相关工具
- CSS 渐变生成 - 可视化生成 linear / radial 渐变 CSS 代码
- 颜色转换 - HEX / RGB / HSL 互转，含对比度与色卡预览
- Flexbox 演练场 - 可视化调节 flex 属性，实时预览布局并生成 CSS
本工具完全在浏览器本地运行，输入内容不会被上传或保存。