CSS Box Shadow Generator

Build CSS box-shadow visually with a live preview. Multiple layers, inset shadows, blur, spread, color picker. Copy the generated CSS ready to drop into a class.

How to use the CSS Box Shadow Generator

Each layer is one comma-separated shadow. Stack 2-3 layers for material-design depth (a soft larger shadow + a sharper smaller one). Inset reverses the shadow to live inside the box. Spread positive grows the shadow, negative shrinks it.