📦 Box Shadow Generator
Free CSS box-shadow generator with live preview. 20+ shadow presets, inset & glow styles, radius/opacity sliders, and one-click copy. Design better UI shadows fast.
⚙️ Controls
📋 Presets (20+)
Soft Shadow
Medium Shadow
Hard Shadow
Lifted
Floating
Inset
Glow Blue
Glow Purple
Glow Green
Glow Red
Neumorphism
Pressed
Card Hover
Bottom Only
Right Side
Left Side
Deep Shadow
Minimal
Spread Out
Offset
Brutal
Elegant
🎨 Shadow Properties
🎨 Box Properties
👁️ Preview
Box Shadow
💻 CSS Code
📚 How To Use
1
Choose a Preset
Select from 22+ beautiful shadow presets including soft, hard, glow, neumorphism, and more to get started quickly.
2
Customize Properties
Adjust horizontal/vertical offset, blur, spread, color, and opacity using the intuitive sliders. Toggle inset for inner shadows.
3
Style the Box
Change box background color, border radius, and size to see how the shadow looks on different elements.
4
Copy & Use
Click the "Copy Code" button to get the CSS box-shadow property and paste it directly into your stylesheet!