What is CSS Box-Shadow Generator?

CSS Box-shadow generator is an online free tool to generate CSS for desired shadow effect for a HTML component. So, no need to try and error values for a perfect shadow for your divs. Just drag some sliders here and get the CSS in a click.

How values are applied?

box-shadow : HORIZONATL_OFFSET VERTICAL_OFFSET BLUR SPREAD;*

Above line is the syntax for providing box shadow in css.

Horizontal Offset: Horizontal offset is the distance of shadow from center in x-axis.It can have positive or negative value.

Vertical Offset: Vertical offset is the distance of shadow from center in y-axis. It can have positive or negative value.

Blur: Blur is the amount of blur that will be applied to shadow. It has to be zero or positive.

Spread: Spread is the radius of the shadow spread that will be subtracted or added to shadow itself. If its value is negative, shadow will be smaller, vice versa.

Color: Color of shadow.

Inset: Inset changes the shadow from outer to inner. By default, shadow is outset.