Box Shadow 生成器

不用手写冗长 CSS，也能做出多层阴影

box-shadow 很容易写出第一版，但一旦要同时调整偏移、模糊、扩散、颜色和多层组合，手动改值就会变得很麻烦。这个可视化工具能让你更快找到合适的阴影效果。

你可以在这里调整什么

工具适合同时尝试细腻和明显的阴影样式，包括：

• 水平和垂直偏移
• 模糊半径与扩散半径
• 颜色和透明度
• 内阴影与外阴影
• 多层阴影叠加

常见使用场景

阴影生成器尤其适合这些情况：

• 为卡片设计层级感
• 给现代 UI 组件添加柔和阴影
• 测试内阴影和发光效果
• 生成可复用的设计系统 CSS

多层阴影要注意节制

叠加多层阴影可以带来更精致的深度感，但也很容易让画面变脏。做出满意效果后，最好再放到浅色和深色背景上看一遍，确认它仍然干净自然。