FreeScroll

Velocity Marquee

A ticker that races, reverses and leans with your scroll.

Loading
Usage 
import { VelocityMarquee } from "./VelocityMarquee";

<VelocityMarquee
  items={["Scroll-driven", "Cinematic", "Plain React"]}
/>

About

A seamless marquee that drifts at rest and listens to the scrollbar: scroll fast and it races, scroll back up and it flips direction, and it leans a few degrees into the motion before settling. One copy of your items is measured and repeated only as often as the width needs, so the loop never shows a seam, and it stops drawing whenever it's off-screen.

What you get

  • Rebuild prompt

    One paste into Claude Code, Cursor, Codex or v0 rebuilds it byte for byte.

  • Source

    VelocityMarquee.tsx + VelocityMarquee.css — plain React and CSS, every comment kept.

  • Vite project

    A ready-to-run project with this exact example and pinned versions — unzip, install, run.

More like this

All components
◐On viewNewPro
Open live demo →

Scramble Text

Text

Headlines that decode themselves out of flickering glyphs.

↕ScrollNewPro
Open live demo →

Aperture Zoom

Scroll

A framed image that opens to full-bleed as you scroll, parting the headline.

↕ScrollNewFree
Open live demo →

Ink Reveal

Scroll

A paragraph that fills in word by word as you scroll through it.