CSS box-shadow 生成器

多重阴影 · 实时预览 · 一键复制

属性说明

X 偏移：正值阴影向右，负值向左
Y 偏移：正值阴影向下，负值向上
模糊半径：越大阴影越柔和；0 表示锐利边缘
扩散：正值放大阴影，负值缩小
inset：变成内阴影，常用于做凹陷效果

使用技巧

多个阴影从上到下叠加（顶层在前）
柔和大阴影：0 25px 50px -12px rgba(0,0,0,.25)
锐利硬阴影：5px 5px 0 #000 拟物风
叠加 2 层产生层次感：上层小+实，下层大+柔