Box Shadow Generator
Design CSS box shadows with a visual editor
Layers
px
px
px
px
#000000→ rgba(0,0,0,0.3)
Inset
Preview
CSS Output
box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);
What is Box Shadow Generator?
Build CSS box-shadow values with intuitive sliders. Adjust horizontal and vertical offset, blur radius, spread, color, and opacity in real time. Add multiple shadow layers for complex effects. Preview against light and dark backgrounds and copy the CSS with one click.