CSS Box-Shadow Generator
Visually create custom box-shadows and get the CSS code.
Shadowed Box
About CSS Box-Shadow
The box-shadow
CSS property adds shadow effects around an element's frame. You can specify 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.
- Horizontal Offset: Positive values move the shadow to the right, negative to the left.
- Vertical Offset: Positive values move the shadow down, negative up.
- Blur Radius: Larger values increase the blur, making the shadow bigger and lighter.
- Spread Radius: Positive values expand the shadow, negative values shrink it.
- Color: Defines the shadow's color. Opacity can be controlled via RGBA.
- Inset: Changes the shadow from an outer (outset) shadow to an inner shadow.