CSS Box-Shadow Generator
Design a CSS box-shadow visually with offset, blur, spread, color, and opacity controls, and copy the generated code, entirely in your browser.
How to Create a CSS Box-Shadow for Free
1. Adjust the X/Y offset, blur, and spread sliders to shape the shadow.
2. Pick a shadow color and adjust its opacity.
3. Toggle Inset for an inner shadow instead of a drop shadow.
4. Click Copy CSS to grab the ready-to-use box-shadow declaration.
Generation in Your Browser
The shadow CSS is generated entirely in your browser from the settings you choose. Nothing is ever sent to a server.