Scroll Text

A scrollable list of text items that highlights the currently visible item in the viewport.

React

Next.js

TailwindCSS

Motion

TypeScript

"use client";

import ScrollText from "@/components/vritti/scroll-text";

export function ScrollTextExample() {
  return (
    <div className="flex items-center justify-center p-8">
      <ScrollText texts={["React", "Next.js", "TailwindCSS", "Motion", "TypeScript"]} />
    </div>
  );
}

Installation


pnpm dlx shadcn@latest add "https://vritti.thesatyajit.com/r/scroll-text"

Dependencies


pnpm add motion