KQ-126 · CUTOUT/TOWN
Cutout Town
A town plan whose buildings stand up from their plots as you scroll — each plot wakes before its band, the facade rotates upright from flat, and a base shadow widens beneath it; windows are lit deterministically per building.
KQ-126 · CUTOUT/TOWN
PAPER QUARTER · 04 PLOTS
KQ-126
- PRESS HALL, plot 01
- CLOCK TOWER, plot 02
- ARCADE, plot 03
- SIGNAL HOUSE, plot 04
RAISED · 0/4
RAISED · 0/4
Scroll the plan - each building stands up from its plot.
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/cutout-town
Props
- buildings
- { id, label, width, height, x }[]
- default —
- Three to six facades and their plots.
- onRaised
- (count) => void
- default —
- How many stand fully, deduped.
- stageHeight
- number
- default 280
- Scroll stage height in px.
| Prop | Type | Default | Description |
|---|---|---|---|
| buildings | { id, label, width, height, x }[] | — | Three to six facades and their plots. |
| onRaised | (count) => void | — | How many stand fully, deduped. |
| stageHeight | number | 280 | Scroll stage height in px. |