CSS Box Shadow Generator

Design CSS box shadows visually.

Free CSS box-shadow generator. Adjust offset, blur, spread, color and opacity with a live preview, then copy the CSS. Runs in your browser.

How to use the CSS Box Shadow Generator

  1. 01Adjust the offset, blur, spread and color.
  2. 02See the live preview.
  3. 03Copy the box-shadow CSS.

Frequently asked questions

Can I make an inset shadow?

Yes — toggle the inset option.