浏览器本地处理
无需登录
支持多层叠加
生成器可视化调整多层阴影参数，实时生成 box-shadow 代码
阴影层（2）
图层 1
10%
图层 2
10%
预览
CSS 代码
box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
支持多层阴影叠加 · 至少保留 1 层浏览器本地生成 · 不上传数据
工具说明CSS
简介
可视化调整 box-shadow 的偏移、模糊、扩散、颜色与透明度，支持添加多层阴影自由叠加，实时预览效果并生成对应的 CSS 声明，内置 7 个常用预设（微小到超大的层级阴影、内阴影、霓虹发光）可以一键加载作为起点。所有处理都在浏览器本地完成，数据不会离开你的设备。
场景
为卡片、按钮、弹窗生成层次分明的阴影还原设计稿里的多层投影效果快速调出 Material Design 风格的高度阴影制作霓虹发光、内嵌等特殊视觉效果
使用步骤
123
选择预设或添加阴影层调整每层参数复制 CSS 代码