图层
X 偏移4px
Y 偏移4px
模糊8px
扩展0px
%
内阴影
什么是 CSS阴影生成器？
CSS阴影生成器可让你可视化构建 box-shadow 值并立即复制 CSS。通过实时预览调整偏移、模糊、扩展、颜色和不透明度。
如何使用 CSS阴影生成器
- 调整 X/Y 偏移、模糊和扩展滑块。
- 选择阴影颜色并设置不透明度。
- 切换“内阴影”以启用内侧阴影效果。
- 添加更多图层以创建复杂阴影。
- 复制 CSS 并粘贴到你的项目中。
了解更多▾
box-shadow 参数
- X/Y 偏移 —水平或垂直移动阴影
- 模糊 —阴影边缘的柔和/模糊程度
- 扩展 —扩大或收缩阴影尺寸
- 内阴影 —在元素内部渲染阴影
常见问题
我可以添加多个阴影吗？
可以。点击“添加图层”来堆叠多个 box-shadow 值，输出 CSS 中会以逗号组合。
如何使用生成的 CSS？
点击“复制 CSS”，然后将 box-shadow 属性直接粘贴到你的 CSS 文件或样式块中。