Skip to content
Portfolio Kit

Scroll Text

A statement paragraph whose words light up one after another as the reader scrolls through it, tied to scroll position rather than played once.

Installation

pnpm dlx shadcn@latest add @portfolio-kit/scroll-text
First time? Add the @portfolio-kit registry to components.json
components.json
{
  "registries": {
    "@portfolio-kit": "https://www.parthjadhav.com/products/portfolio-kit/r/{name}.json"
  }
}

Usage

Examples

Highlighted words

A studio manifesto that fills character by character from muted to full colour, with the services lighting up in the accent. Unread text stays readable at every point. Scroll the preview.

Two-column about

An about page with a pinned portrait column beside paragraphs that each fill in as they pass through the middle of the screen. Scroll the preview.

API Reference

Used in

Creative Developer template