Layered Shadow Studio

Realistic stacked CSS box-shadows from one slider.

Build buttery, realistic depth by stacking several box-shadow layers along an easing curve — the layered-shadow technique — from a single elevation slider plus light-direction, color tint, and inset controls. Watch a live preview on a light or dark stage and copy a ready-to-paste box-shadow value or its Tailwind arbitrary form. Pure math in your browser, no dependencies.

Processes your input on your device without uploading it. Libraries or models may need downloading. No site account is required.