About Box Shadows
The box-shadow CSS property adds a shadow around an element’s entire box. Multiple shadows can be set by separating each effect by commas. A box shadow is described by X and Y offsets, blur, spread radius and color.
If a border-radius is specified on the element, the box shadow takes on the rounded corners.
box-shadow property
box-shadow: x-offset y-offset blur-radius spread-radius color | inset
x-offset
Horizontal offset relative to the element. Positive numbers move the shadow to the right. Negative numbers move it to the left. If 0, the shadow’s horizontal position is placed behind the element.
y-offset
Vertical offset relative to the element. Positive numbers move the shadow down. Negative numbers move it up. If 0, the shadow’s vertical position is placed behind the element.
blur-radius
Blur radius. The bigger the value, the bigger and lighter the blur. Negative values are not allowed. If 0, the shadow will have a sharp edge.
spread-radius
Spread radius. Positive values will cause the shadow to grow bigger. Negative values will cause the shadow to shrink.
color
Color value of the shadow.