KQ-487 · LIFT/SHADOW
Lift Shadow
The element under the pointer lifts off the page: its painted image rises a few pixels toward the cursor, scales a hair, and casts a soft shadow that spreads as it lifts, then settles back when the pointer leaves. The box is the real DOM's.
KQ-487 · LIFT/SHADOW
Waylight · harbour board
Every berth answers to a touch.
Rest the cursor on a row, a reading, or a button and it lifts clear of the board, a soft shadow gathering underneath, while everything else stays flat on the page.
| Berth | Vessel | ETA | State |
|---|---|---|---|
| B2 | Wayfarer | 05:55 | cleared |
| B4 | Long Reach | 06:30 | holding |
| B6 | Solent Star | 07:05 | inbound |
Berths held
22Avg wait
14m14mit rises to meet you
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/lift-shadow
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| selector / lift / scale | string · number · number | — | Which elements lift, how far in px, and how much they grow. |
| shadow / spring | number | — | Shadow strength and how quickly the lift settles. |