To add shadows to a block-level element, apply the following box-shadow style:

box-shadow: color offsetX offsetY blur spread inset;

where color sets the shadow color, offsetX and offsetY set the offset of the shadow in the horizontal and vertical directions, blur defines the blurring of the shadow, and spread sets the size of the shadow relative to the size of the block element. Add the keyword inset to create an interior shadow rather than an exterior shadow.

Use the web form below to generate the CSS code for applying the box-shadow style to the preview box. You can insert multiple shadows by clicking the [+] box. You can remove shadows by clicking the [-] box. The corresponding CSS code appears below the preview box.