盒阴影生成器

免费

设计平滑的多层 CSS 盒阴影，带实时预览，并可复制为 CSS 或 Tailwind。

控件

图层5距离24模糊48扩展0光照角度90不透明度0.18缓动1.8

颜色inset深色背景

预览

5 层

CSS

box-shadow:
  0px 1.32px 2.65px 0px rgba(15, 23, 42, 0.08),
  0px 4.61px 9.22px 0px rgba(15, 23, 42, 0.08),
  0px 9.57px 19.14px 0px rgba(15, 23, 42, 0.07),
  0px 16.06px 32.12px 0px rgba(15, 23, 42, 0.06),
  0px 24px 48px 0px rgba(15, 23, 42, 0.05);

Tailwind

shadow-[0px_1.32px_2.65px_0px_rgba(15,23,42,0.08),0px_4.61px_9.22px_0px_rgba(15,23,42,0.08),0px_9.57px_19.14px_0px_rgba(15,23,42,0.07),0px_16.06px_32.12px_0px_rgba(15,23,42,0.06),0px_24px_48px_0px_rgba(15,23,42,0.05)]