CSS Box Shadow Generator Online Free
Create custom CSS box shadow codes with offsets, spreads, and blur settings. Determining horizontal offsets, blur spreads, and opacity levels for CSS box-shadows visually is much faster than guessing code numbers.
Your inputs are processed locally in your browser. Nothing is uploaded to any server.
Shadow 1
X Offset0px
Y Offset4px
Blur16px
Spread0px
Color
Opacity25%
box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.25);How to Use
- 1Use sliders to adjust horizontal and vertical offsets.
- 2Change blur and spread radius for desired softness and size.
- 3Pick a shadow color and toggle the inset option if needed.
- 4Copy the final CSS rule.