CSS Box Shadow Generator
Create visual depth with custom drop shadows.
25%
How Box Shadow Works
The box-shadow property adds shadow effects around an element's frame. You can set multiple effects separated by commas. A box shadow is described by X and Y offsets relative to the element, blur and spread radius, and color.
Parameters Guide
- Horizontal Offset (x): Positive values push the shadow to the right, negative values to the left.
- Vertical Offset (y): Positive values push the shadow down, negative values up.
- Blur Radius: The higher the number, the more blurred (faded) the shadow will be.
- Spread Radius: Positive values increase the size of the shadow, negative values decrease it.
- Inset: Changes the shadow from an outer drop shadow to an inner shadow.