How to assemble a CSS box-shadow declaration

1. Offsets

   "X offset (px)" and "Y offset (px)" move the shadow horizontally (positive = right) and vertically (positive = down). The CSS default is no offset; common card shadows use small Y like `4` and X near 0.

2. Blur and color

   "Blur (px)" controls softness — 0 is hard-edged, 10+ is hazy. "Color" accepts any CSS color, including rgba/hex with alpha. For subtle UI shadows, use `rgba(0,0,0,0.15)` and a moderate blur.

3. Press Run

   Result is a single `css` field — `<x>px <y>px <blur>px <color>`. Paste as the value of `box-shadow:`. No spread parameter or inset are emitted; the syntax allows them but this tool keeps to the 4-arg form.

4. Multiple stacked shadows

   Real designs often stack 2-3 shadows separated by commas (a soft long one + a tight short one) for depth. Use this tool to generate each, then concat manually with commas inside one `box-shadow:` value.