CSS Box Shadow Generator
Tune multi-layer box-shadows visually: offset, blur, spread, colour, opacity and inset. Six presets cover subtle lift, cards, modals, inset, hard offset and neon, and the preview toggles light/dark because a 30% black shadow disappears on dark UI. Copy-ready CSS output.
Runs in your browser
Real-time
Preview
shadow
Presets
Layers
CSS
About this tool
Tune multi-layer box-shadows visually: offset, blur, spread, colour, opacity and inset. Six presets cover subtle lift, cards, modals, inset, hard offset and neon, and the preview toggles light/dark because a 30% black shadow disappears on dark UI. Copy-ready CSS output.
How to use
- Fill in the input box above, or click "Fill sample" to try it instantly
- Adjust the options as needed — results update as you type
- Click "Run" to get the result, then copy or export it in one click
Tips
- Runs entirely in your browser — your data never leaves the device
- Completely free, no registration, no usage limits
- Most tools compute in real time as you type