PrivTab

CSS 阴影生成器

生成 CSS 盒子阴影

在浏览器中运行 · 无需上传

此工具及本页说明目前仍为英文。功能完全相同：一切都在你的浏览器中运行。

Shadow layers
Box and background
Ready-made
  • 任何内容都不会离开你的设备
  • 服务器不限制文件大小
  • 无需注册，无水印
  • 免费

How to make a box shadow

  1. Start from a ready-made shadow, or adjust the sliders.
  2. Add layers: a tight shadow plus a wide, soft one looks most natural.
  3. Copy the CSS.

Tips

  • Low opacity (8 to 20%) and a negative spread give soft, modern shadows.
  • Inset shadows look pressed in, for inputs and toggles.
  • Change the box and background colors to see the shadow on your own design.

常见问题

Does box-shadow slow down a page?

Rarely. Very large blurs on many moving elements can, so keep animated shadows simple.

Is anything uploaded?

No. The preview is drawn by your browser.