ns-ui

Scroll Particle Tunnel

Scroll scrubs a camera through a monochrome point tunnel — velocity stretches dots into motion streaks, cursor drift adds parallax, and mono section labels at fixed depths snap into focus as you fly past.

Use when scroll flies a camera through a 3D particle tunnel with velocity-streaked dots and mono labels snapping into focus at fixed depths; use for a flythrough narrative, not a content-crossfade story or an instrument/HUD readout; pick gallery-gantry-track instead when the things at depth are real labelled cards rather than unlabelled particles, scroll-story-strata when the scroll carries distinct content sections, or transition-panel-crumble when the movement is a one-off layout swap rather than a scroll-length journey.

Install

npx shadcn add https://design.helpmarq.com/r/scroll-particle-tunnel.json
  • scroll
  • canvas
  • particles
  • 3d
  • parallax
  • scrub
  • typography
  • monochrome
ns-ui / scroll-particle-tunnel
01 SIGNAL
02 NOISE
03 FIELD
04 VOID
SCROLL TO FLY

Props

PropTypeDefaultDescription
labels?string[]["01 SIGNAL", "02 NOISE", "03 FIELD", "04 VOID"]section labels pinned at fixed depths along the tunnel
pointCount?number3000points seeded in the cylinder shell
className?string