CSS 阴影生成器
强大的 CSS Box Shadow 生成器，支持多层阴影叠加、实时预览及代码生成。
实时预览
盒子颜色
背景颜色
阴影层级
Layer 1
Layer 2
属性调整
阴影颜色
透明度15%
水平偏移 (X)10px
垂直偏移 (Y)10px
模糊半径 (Blur)20px
扩展半径 (Spread)0px
CSS 代码
box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.15),
-10px -10px 20px 0px rgba(255, 255, 255, 0.8);关于此工具
这是一个功能强大的 CSS Box Shadow 生成器，专为前端开发者和设计师打造。它支持添加多个阴影层级，可以精细调节每一层阴影的水平偏移、垂直偏移、模糊半径、扩展半径、颜色及透明度。支持内阴影（Inset）模式。提供实时预览框，所见即所得，调整完成后可一键复制兼容性良好的 CSS 代码。
功能特点
- 🎨 多层阴影：支持添加无限个阴影层级进行叠加
- ⚡ 实时预览：调整参数即时查看阴影效果
- 🔧 精细控制：独立调节 X/Y 偏移、模糊、扩展、颜色
- 📥 内阴影支持：一键切换 Inset 内阴影模式
- 📋 一键复制：生成标准 CSS 代码并快速复制
- 🌈 颜色调节：支持 HEX/RGB/HSL 颜色格式调节