CSS Box Shadow Generator

Design box shadows visually — sliders for offsets, blur, spread, color and inset with live preview.

X offset: 10px Y offset: 10px Blur: 20px Spread: 0px Color: Opacity: 25% Inset shadow

box-shadow: …

How to use

Drag the sliders, pick a color, toggle inset — copy the generated CSS when it looks right.

Can I make inset shadows?

Yes — toggle the inset checkbox for inner shadows.

Does it output the CSS?

The exact box-shadow declaration is shown, ready to copy into your stylesheet.

☕

Every tool runs 100% in your browser — no uploads, no signups. If a tool saved you time, consider supporting us with a small donation.