CSS Box Shadow Generator

Create beautiful box-shadow effects visually. Add multiple layers, adjust properties, copy CSS.

Shadow Layers

Element

Background

Border Radius12px

Box Background

CSS Output

CSS Box Shadow Syntax

The CSS box-shadow property adds shadow effects around an element's frame. The syntax is:

box-shadow: [inset] offset-x offset-y blur-radius spread-radius color;

offset-x/y — Position of the shadow
blur-radius — How blurry the shadow appears
spread-radius — How far the shadow expands
inset — Makes the shadow appear inside the element

Multiple shadows can be combined with commas to create layered depth effects.