ai-animate

Text

ScrollVelocity

Scroll-driven marquee that speeds up or slows down based on page scroll velocity.

Installation

npm install @ai-animate/core

Usage

import { ScrollVelocity } from '@ai-animate/core'


<ScrollVelocity texts={["Streaming · Skeletons · Voice ·", "Agents · Tools · Workflows ·"]} />

Props

textsReact.ReactNode[][]Array of text/node rows. Each row alternates direction automatically.
velocitynumber100Base scroll speed in px/s
dampingnumber50Spring damping — higher = less oscillation
stiffnessnumber400Spring stiffness — higher = snappier
numCopiesnumber6Number of text copies to fill the strip
classNamestring''className on each text span copy