MYMONDAY.AIShadowBox

Local CSS box-shadow generator

Design a CSS box shadow with live preview

Tune two shadow layers, see the result on a card, and copy a clean box-shadow declaration for your interface.

* Everything runs in your browser. No shadow values are uploaded.

Shadow layer 1
Shadow layer 2

CSS ready

box-shadow: 0px 12px 28px 0px rgba(23, 32, 29, 0.18);
ShadowBox

QUICK GUIDE

Build depth one layer at a time

01

Use a small offset and soft blur for a quiet surface shadow.

02

Add a second, lighter layer when one shadow cannot describe the depth you want.

03

Use negative spread to keep a soft shadow close to the component edge.

04

Try inset for pressed controls or an inner border effect.

FAQ

Box-shadow questions

What is the order of box-shadow values?

The output uses optional inset, X offset, Y offset, blur radius, spread radius, and color.

Why use two layers?

Multiple shadows can create a more natural elevation by combining a close dark edge with a wider soft shadow.

Does ShadowBox change my page?

No. The preview is local to this page and the generated declaration is plain CSS you can copy.