CSS Box Shadow Generator
Design CSS box shadows with a live preview and copy-ready code. Free shadow generator, no signup.
Frequently asked questions
- What do the four length values mean?
- Offset X moves the shadow horizontally, offset Y vertically, blur softens the edge and spread changes the shadow size.
- Is the CSS copy-ready?
- Yes, the output is a complete box-shadow declaration including an rgba color with your chosen opacity.
- What does inset do?
- It draws the shadow inside the element instead of outside, useful for pressed buttons and input wells.
- Does the preview update live?
- Yes, the card above the code updates with every change.
This tool runs entirely in your browser. No data is uploaded anywhere.