KQ-379 · SAND/SCROLL

Sand Scroll

The interface dissolves into sand below a line and reassembles as you scroll. Grains stream down and drift from their home pixels, further the deeper they sit below the line, and settle back into crisp type as the line passes. Progress follows the surface's place in the viewport, plays once, or takes a value directly.

KQ-379 · SAND/SCROLL
Mode

Basinworks · silt survey 22-B

Four stations, one falling line.

Every reading on this reach sits the way the river left it: buried below a line that only a slow sweep uncovers. Scroll past the fold and the grid settles out of the drift; scroll back and it loosens into sand again.

StationBedDepthState
S-04Delta channel2.1 msettled
S-11Bar sediment4.6 mshifting
S-17Old levee1.8 mburied
S-23Spillway apron6.3 munstable

it settles as you scroll

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/sand-scroll

Props

PropTypeDefaultDescription
mode / progress / duration"scroll" | "auto" | "manual" · number · numberWhat drives the line: the viewport, a one-shot play, or the progress prop.
grain / scatter / fallnumberGrain size in px, how far grains drift sideways, and how fast they stream down.
softness / fade / directionnumber · number · "down" | "up"How wide the settling band is, how much loose sand fades, and which way the line runs.