CSS box-shadow Generator

Adjust shadow parameters and generate CSS code.

Parameter guide

X/Y offset=shadow direction, Blur=softness, Spread=expansion, Color/Opacity=appearance. Preview updates in real-time.

X offset (px)

Y offset (px)

Blur (px)

Spread (px)

Color

Opacity

15%

Preview (real-time)

Shadow appears here

CSS

Usage

Adjust offset, blur, spread, color for box-shadow preview. Add multiple shadows. Copy CSS.

Card elevation, button press effect, modal shadow, depth.

0 4px 6px -1px rgba(0,0,0,0.1), 0 10px 15px -3px rgba(0,0,0,0.1)