KQ-109 · PUNCH/TYPE
Punch Type
A word die-cut through the surface — the letterforms are true SVG mask cutouts onto a vista behind, and sweeping the pointer shifts the scene so the windows fill with moving color.
KQ-109 · PUNCH/TYPE
STENCIL PLATE
KQ-109
Decorative stencil plate: moving the pointer slides the scene behind the punched letters.
PLATE 109 · DIE-CUT
Sweep the plate - the vista moves behind the letterforms.
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/punch-type
Props
- text
- string
- default —
- One short word, punched at display size.
- scene
- ReactNode
- default —
- The layer behind; defaults to a deterministic vista.
- depth / height
- number / number
- default 16 / 200
- Max scene counter-shift and stage height.
| Prop | Type | Default | Description |
|---|---|---|---|
| text | string | — | One short word, punched at display size. |
| scene | ReactNode | — | The layer behind; defaults to a deterministic vista. |
| depth / height | number / number | 16 / 200 | Max scene counter-shift and stage height. |