⬛
CSS Box Shadow Generator
Dial in the perfect CSS box-shadow with sliders for horizontal/vertical offset, blur, spread and opacity, plus a color picker and inset toggle. A live preview updates as you go and the CSS is one click away.
box-shadow: 0px 10px 25px -5px rgba(26, 46, 143, 0.30);🔒 This tool runs entirely in your browser. Your data is never uploaded.
Frequently asked questions
What can I control?＋
Horizontal and vertical offset, blur, spread, colour, opacity and the inset toggle, all with a live preview.
Can I stack multiple shadows?＋
CSS supports comma-separated shadows. Craft each one here and combine them in your stylesheet.
How do I make a soft, subtle shadow?＋
Use a small offset, a larger blur, a small or negative spread and a low-opacity colour.