CSS shadow generator
Build a box-shadow with explicit offsets, blur and spread.
01 / Your input
02 / Your result
Your result will appear here.
How to use this tool
- Enter your own values, or select Load example to restore the demonstration inputs.
- Review Horizontal offset, Vertical offset, Blur radius, Spread, Shadow color before selecting Run tool.
- Inspect the result, then copy it or download the generated file. Changing inputs clears the previous result.
Processing happens in this browser. Inputs are not uploaded or saved by the tool. Reset clears the result and restores the default settings.
Example and expected result
The example produces 0px 12px 24px 0px #536ed8.
Limits and interpretation
This creates a single opaque shadow. The preview is illustrative; check it on the final surface.