Components
Timeline
Displays a chronological sequence of events along a vertical or horizontal line.
Overview
Timeline renders a list of events along a line with timestamps, icons, and content. Supports vertical and horizontal orientations and custom dot indicators.
Project Created
Jan 15, 2026
Design System v1.0
Feb 20, 2026
95 Components Shipped
Mar 28, 2026
v2.0 Roadmap
Upcoming
Usage
<Timeline>
<Timeline.Item icon={<Check />} date="Jan 2024">
<Timeline.Title>Project Started</Timeline.Title>
<Timeline.Description>Initial commit and setup.</Timeline.Description>
</Timeline.Item>
<Timeline.Item icon={<Star />} date="Mar 2024">
<Timeline.Title>v1.0 Released</Timeline.Title>
<Timeline.Description>First public release.</Timeline.Description>
</Timeline.Item>
</Timeline>API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
orientation | 'vertical' | 'horizontal' | 'vertical' | Layout direction |
children | ReactNode | — | Timeline items |
Timeline.Item Props
| Prop | Type | Default | Description |
|---|---|---|---|
icon | ReactNode | Dot | Custom indicator |
date | string | — | Date/time label |
Related Components
| Component | When to Use Instead |
|---|---|
| Stepper | Sequential process steps |
| Changelog | Version-based timeline |