Box Shadow Generator

Create CSS box shadows with real-time preview

Preview

Background Color:

Shadows (1/5)

Shadow Layer #1

Horizontal Offset (X): 0px

Vertical Offset (Y): 4px

Blur: 6px

Spread: 0px

Color

Opacity: 10%

Inset Shadow

CSS Output

box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1);

CSS with Vendor Prefixes

box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1);

Presets

Box Shadow Generator

Shadow Layer #1

関連ツール