CSS Box Shadow Generator

Create custom box shadows with live preview and one-click copy.

CSS TOOLS
box-shadow: 12px 12px 24px 0px rgba(0, 0, 0, 0.25);

How to use CSS Box Shadow Generator

1

Set shadow values

Adjust offset, blur and spread.

2

Tune color

Pick color and opacity, then toggle inset if needed.

3

Copy CSS

Copy box-shadow rule for your component.

Related Tools

CSS TOOLS

CSS Gradient Generator

Generate linear and radial CSS gradients with live preview.

CSS TOOLS

CSS Border Radius Generator

Adjust all corner radii and generate border-radius CSS quickly.

CSS TOOLS

CSS Glassmorphism Generator

Build frosted-glass cards with blur and transparency controls.