CSS Box Shadow Generator
CSS Box Shadow Generator gives you sliders for offset, blur, spread, colour and inset, with a live preview and copyable box-shadow CSS.
Last updated: July 2026
Design CSS box-shadows visually with sliders and copy the code. Free, instant, in-browser box-shadow generator.
Loading tool…
How to use CSS Box Shadow Generator
- Adjust the shadow sliders.
- See the live preview.
- Copy the CSS.
Frequently asked questions
Does it support inset shadows?
Yes — toggle inset on or off.
Can I control the colour and opacity?
Yes, including the shadow colour and its transparency.
Is it free?
Yes, free and instant.
Related developer tools
UUID Generator
Generate random v4 UUIDs (GUIDs) in bulk and copy them with one click. Free, instant and fully in-browser using the secure crypto API.
Base64 Encode / Decode
Encode text to Base64 or decode Base64 back to text instantly. Free, private, in-browser — supports full Unicode (UTF-8).
JSON Formatter & Validator
Format, beautify, minify and validate JSON instantly. Free, private, in-browser JSON formatter with clear error messages.
QR Code Generator
Generate a QR code from any text, link, email or phone number and download it as a PNG. Free, instant and fully in-browser.