Design Toolspublic tool
Box Shadow Generator
Layer CSS box-shadows with per-layer offset, blur, spread, colour and inset, then copy the declaration, the Tailwind class or a ready-made shadow theme.
- Layers
- 1
- Inset layers
- 0
- Inset
- No
- Output
- CSS
Preview
0px 4px 12px -2px #0f172a
A card with the shadow stack applied live.
Layer 1
0px 4px 12px -2px #0f172a
0px
4px
12px
-2px
CSS
box-shadow declaration
box-shadow: 0px 4px 12px -2px #0f172a;
Tailwind v4
Arbitrary-value shadow class
shadow-[0px_4px_12px_-2px_0f172a]