Loading...

Dev Utilities

Essential Tools

HTML CSS JS Playground

Theme

Box Shadow Generator

Create beautiful CSS box shadows with multiple layers and live preview

Shadow Layers1

Layer 1

X Offset: 0px

Y Offset: 4px

Blur: 8px

Spread: 0px

Color

Opacity: 25%

Inset shadow

Presets

Live Preview

Background:

Preview Box

CSS Output

Usage Examples

CSS Class

.shadow-element {
  
}

HTML

<div class="shadow-element">
  Your content here
</div>

Individual Values

Layer 1: 0px 4px 8px 0px rgba(0, 0, 0, 0.25)