CSS Box Shadow Generator

Generate CSS box shadow with visual preview

box shadowcssshadoweffectstyle

Box Color

Background

Shadows (2)

Shadow 1

Inset

X Offset: 0px

Y Offset: 4px

Blur: 6px

Spread: -1px

Opacity: 10%

Shadow 2

Inset

X Offset: 0px

Y Offset: 2px

Blur: 4px

Spread: -2px

Opacity: 10%

Presets

CSS Code

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

Tailwind (inline style)

style={{ boxShadow: '0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1)' }}

About CSS Box Shadow Generator

Generate CSS box shadow with visual preview This free online tool runs entirely in your browser, ensuring your data stays private and secure. No server uploads, no data collection. Fast, reliable, and available 24/7.

100% PrivateInstant ResultsFree Forever