Box Shadow 可视化编辑器,支持多层阴影叠加
box-shadow: 10px 10px 20px rgba(0,0,0,0.3);
通过滑块和颜色选择器调节阴影的六个属性:水平偏移(X轴方向)、垂直偏移(Y轴方向)、模糊半径(越大越模糊)、扩散半径(阴影大小)、阴影颜色(含透明度)、内阴影(inset 开关)。左侧预览方块实时显示效果,也可使用 CSS 渐变生成器 工具。
点击「+ 添加阴影层」按钮创建新的阴影层。通过顶部的图层标签切换不同层进行编辑。支持同时查看多层阴影叠加效果。点击图层标签上的关闭按钮可删除该层(需保留至少 1 层),可配合 CSS 圆角生成器 工具一起使用。
面板底部实时展示生成的 box-shadow CSS 代码,多层阴影以逗号分隔。点击「复制代码」即可一键复制到剪贴板。