Build beautiful layered shadows visually. Drag, tune, and copy your CSS instantly.
box-shadow accepts up to 6 values: optional inset, horizontal offset, vertical offset, blur radius, spread radius, and color. Multiple shadows are comma-separated, letting you stack unlimited layers for complex effects like neumorphism or glassmorphism.
The first shadow in the list is rendered on top. This matters most with inset shadows and when blending multiple colored layers. Drag layers in the list to reorder them — the live preview and CSS update instantly.
Large blur values are GPU-expensive. For animated shadows, animate opacity of a pseudo-element instead of animating box-shadow directly — this stays entirely on the compositor thread and avoids layout recalculations.