Table
Structured data displays for lists, records, and complex information.
Usage
Use Tables to display repetitive data points in a way that allows for easy scanning and comparison. Perfect for booking lists, transaction histories, and user management.
Content
Recent Bookings
A detailed view of customer transactions.
| Ticket | Customer | Event | Status | Amount |
|---|---|---|---|---|
| BK-001 | Alice Johnson | Tech Conference 2026 | Confirmed | ZMW 1,200 |
| BK-002 | Bob Smith | Summer Music Fest | Pending | ZMW 850 |
| BK-003 | Charlie Davis | Workshop: UI Design | Cancelled | ZMW 450 |
Spec
- Header: #F8F8F8 background with deep neutral font-bold labels.
- Borders: Standard 1px #E5E5E5 around container and as row dividers.
- Hover: Subtle Primary accent (5%) on row hover.
- Typography: 14px text-sm throughout.
- Padding: uniform 16px (p-4/px-4) for headers and cells.
Anatomy
GRID ARCHITECTURE