Activity Ticker
An infinite-scrolling vertical feed of activity/transaction cards with status badges. Great for fintech, SaaS dashboards, and social proof sections.
KYC Submitted
Steven Kirk, London, UK
USD Deposit (ACH)
$500,000 from J. Kirk
+$500 PYUSD
from U80a...7D0a
1,000,000 USDC
to External Wallet
KYC Submitted
Steven Kirk, London, UK
USD Deposit (ACH)
$500,000 from J. Kirk
+$500 PYUSD
from U80a...7D0a
1,000,000 USDC
to External Wallet
KYC Submitted
Steven Kirk, London, UK
USD Deposit (ACH)
$500,000 from J. Kirk
+$500 PYUSD
from U80a...7D0a
1,000,000 USDC
to External Wallet
Features
- Infinite vertical scroll — Seamless upward loop using useAnimationFrame
- Status badges — Completed, pending, confirming, credited variants
- Edge fade — Gradient mask fades cards at top and bottom
- Viewport-aware — Pauses animation when offscreen
- Customizable speed — Configurable scroll speed and gap
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| items | ActivityItem[] | - | Array of activity items with id, icon, title, subtitle, status, statusVariant |
| speed | number | 30 | Scroll speed in pixels per second |
| gap | number | 16 | Gap between cards in pixels |
| cardHeight | number | 80 | Card height in pixels |
| className | string | - | Additional className |