Back to Components
Components

Activity Timeline

Vertical activity feed with icon, title, description, timestamp, and connector line.

  1. Invoice sent

    2 min ago

    Invoice #1234 was sent to client@example.com

  2. New user registered

    15 min ago

    john@example.com signed up for a trial

  3. Payment received

    1 hour ago

    $2,400 from Acme Inc

  4. Project deployed

    3 hours ago

Dependencies

  • clsx
  • tailwind-merge

Files

  • components/ui/activity-timeline.tsx

Installation

Using shadcn CLI

npx shadcn add activity-timeline --url https://ui.hampton.io

Manual installation

Copy the component file to your project and install dependencies:

npm install clsx tailwind-merge