盒子阴影 CSS 生成器
直观地生成和预览 CSS box-shadow 属性。
阴影设置
调整滑块以自定义阴影效果
阴影 1
预设
尝试预定义的阴影样式
预览
查看生成的阴影效果
Preview
生成的 CSS
box-shadow: 0px 4px 6px 0px #00000040;盒子阴影属性参考
属性说明
- • X 偏移：阴影的水平位置（正值：右，负值：左）
- • Y 偏移：阴影的垂直位置（正值：下，负值：上）
- • 模糊：阴影的模糊半径（0：清晰，值越大越模糊）
- • 扩展：阴影的大小（正值：扩大，负值：缩小）
- • 颜色：阴影的颜色（HEX、RGB、RGBA 等）
- • 内阴影：阴影是否为内阴影