Box Shadow Generator

Design CSS box-shadows with offset, blur, and color, then copy the rule.

X

Y

Blur

Color

Suggested Tools

Text Shadow Generator
Generate CSS text-shadow declarations for headings and stylized type.
Border Radius Generator
Create CSS border-radius values, including per-corner rounding.
Clip-path Generator
Generate CSS clip-path shapes for creative image and section masks.

Box Shadow Generator builds layered shadows for cards and buttons with live-friendly defaults.

Tune the controls, run, and paste box-shadow into your stylesheet.

Please enable JavaScript.