About the Box Shadow Generator

This free CSS box shadow generator provides a visual editor with live preview for creating box shadows. Adjust horizontal and vertical offsets, blur radius, spread radius, shadow color with opacity control, and toggle inset mode. You can layer multiple shadows on a single element for complex effects. The generated CSS is ready to copy into your stylesheets and works in all modern browsers.

Box Shadow Properties

Offset X: Horizontal shadow offset in pixels (positive = right, negative = left)
Offset Y: Vertical shadow offset in pixels (positive = down, negative = up)
Blur: The blur radius that softens the shadow edge
Spread: Positive values expand the shadow, negative values shrink it
Color: The shadow color with adjustable opacity
Inset: Creates an inner shadow instead of an outer drop shadow