CSS Box Shadow Generator

Design perfect CSS box shadows with full control over every parameter. Live preview and instant copy — free.

Horizontal Offset4px

Vertical Offset4px

Blur Radius20px

Spread Radius0px

Shadow Color

Opacity60%

Box Color

Inset Shadow

CSS Output

box-shadow: 4px 4px 20px 0px rgba(99,102,241,0.6);

How to Use the Box Shadow Generator

Adjust the sliders to control horizontal and vertical offset, blur radius, spread, and color. Enable inset to create an inner shadow effect. Copy the generated CSS and paste it directly into your stylesheet. Perfect for cards, buttons, modals, and UI components.