Box Shadow Generator
Box Shadow Generator: free, fast and private. Works in your browser, nothing is uploaded, no sign-up needed.
How to use
Design a CSS box-shadow with a live preview: set the horizontal and vertical offset, blur, spread, color and opacity, or switch to an inset shadow. Copy the finished CSS in one click. Soft, low-opacity shadows usually look the most natural.
- Pick or enter a color.
- Adjust the options and watch the live preview.
- Copy the color or CSS code.
More tools
Frequently asked questions
What does spread do?
Spread grows or shrinks the shadow before it is blurred. Positive values make it larger and negative values make it smaller.
What is an inset shadow?
An inset shadow is drawn inside the element, which creates a pressed-in look.
Is it free?
Yes. All tools are free, with no sign-up and no limits.
Is my image or data uploaded?
No. Everything runs locally in your browser, so your images and colors stay private.
Can I use the generated CSS in my projects?
Yes. The code is yours to use in personal and commercial projects without attribution.