Skip to content

Dial in a CSS box-shadow visually

Drag sliders to craft a shadow, copy the CSS.
offset x0
offset y12
blur28
spread0
opacity35
color
box-shadow: 0px 12px 28px 0px rgba(0,0,0,0.35);

About this tool

How to use it

  1. Move the sliders for X offset, Y offset, blur, spread, and opacity.
  2. Toggle inset if you need an inner shadow.
  3. Copy the box-shadow CSS.

Why it lives here

Everything runs in your browser. No account, no ads, no tracking, and no upload.

Tagged with

box shadowcssshadow designers

related tools

Lorem ipsum Placeholder copy by paragraphs, sentences or words — any length, instantly. Writers Color palette Generate palettes by harmony rule with CSS variables. Designers Color converter Enter a color once and get it in HEX, RGB, and HSL simultaneously. Designers