# Motion Scroll Velocity

Marquee text whose speed follows scroll velocity.

- id: `motion-scroll-velocity`
- Page: https://agentic-ui-kit.com/components/motion-scroll-velocity
- Live preview: https://agentic-ui-kit.com/live/component/motion-scroll-velocity?piece=motion-scroll-velocity

## Install

```bash
agentic-ui add motion-scroll-velocity
npx shadcn@4.17.0 add @agentic-ui/motion-scroll-velocity
```

## Metadata

- **Level:** block
- **Category:** motion
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** velocity-reactive-marquee, scroll-velocity-speed-up, scroll-velocity-skew, direction-follows-scroll, alternating-rows, seamless-loop, custom-separator, pause-offscreen, reduced-motion-fallback
- **Intents:** communicate
- **Suits domains:** marketing, media, saas, ecommerce
- **Interaction:** scroll
- **Screen role:** overview
- **Density:** comfortable
- **Dark mode:** yes
- **Use it for:** marquee text whose speed follows scroll velocity, scrolling text banner that skews when you scroll fast, velocity scroll text rows that reverse direction with the page, kinetic typography band for a landing page
- **Avoid when:** A plain looping logo or text strip is enough (use motion-marquee), The text must be read in full while it moves (use motion-text-reveal-split), Several moving bands compete in the same viewport, Enterprise personality, where the scroll group is not allowed (plain text is shown)
- **Preserve when adapting:** line-read-once, pause-offscreen, ticker-not-react-state, plain-text-fallback
- **Replace when adapting:** lines, separator, speed, velocity-gain, max-skew
- **Adaptation effort:** low
- **Coupling:** low
- **Quality breakdown:** visual 9/10, responsive 9/10, accessibility 9/10, code 9/10
- **npm dependencies:** @agentic-ui/motion, @agentic-ui/tokens, motion, react
- **Motion:** profile subtle, library motion, reduced-motion fallback yes, target 60 fps
- **npm dependencies (registry):** motion@12.23.24
- **Registry dependencies:** lib-motion