阴影生成器 | CSS Box Shadow 工具
可视化的CSS Box Shadow生成器,支持实时预览。
0px
0px
10px
0px
20%
CSS Code
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
使用说明
- 调整滑块以更改水平和垂直偏移、模糊半径和扩展半径。
- 切换“内阴影”以创建内部阴影。
- 使用控件更改阴影颜色和不透明度。
- 复制生成的CSS代码以在您的项目中使用。
关于 Box Shadow
水平位移 (Offset X)
指定阴影的水平距离。正值将阴影向右移动,负值向左移动。
垂直位移 (Offset Y)
指定阴影的垂直距离。正值将阴影向下移动,负值向上移动。
模糊半径 (Blur Radius)
值越大,阴影变得越大且越淡。如果设置为0,阴影将是锐利的。
扩展半径 (Spread Radius)
正值增加阴影的大小,负值减小它。