Basic Tables
Standard HTML tables for displaying datasets
Basic Table
Default table with minimal styling
| Name | Role | Status | Action |
|---|---|---|---|
| Liam Johnson | Developer | Active | |
| Emma Smith | Designer | Pending | |
| Noah Williams | Manager | Inactive |
Striped Rows
Zebra-striping for table rows
| Product | Price | Sales |
|---|---|---|
| Apple MacBook Pro | $1,299 | 82 |
| Dell XPS 13 | $999 | 45 |
| Sony WH-1000XM5 | $348 | 120 |
Bordered Table
Borders on all sides of the table and cells
| ID | User | |
|---|---|---|
| #1001 | Alice Brown | alice@example.com |
| #1002 | Bob White | bob@example.com |
| #1003 | Charlie Green | charlie@example.com |
Hoverable Rows
Highlight rows on mouse hover
| Project | Progress | Team |
|---|---|---|
| Landing Page |
|
|
| Mobile App |
|
|
| Dashboard UI |
|
|
Dark Header
Table with a dark background header
| Invoice | Client | Due Date | Amount | Status |
|---|---|---|---|---|
| #INV-8890 | Acme Inc. | Oct 24, 2023 | $3,200.00 | Paid |
| #INV-8891 | Globex Corp | Nov 01, 2023 | $1,500.00 | Pending |
| #INV-8892 | Soylent Corp | Nov 05, 2023 | $4,850.50 | Overdue |
Compact Table
Reduced padding for denser data display
| # | Task | Date | Team |
|---|---|---|---|
| 1 | Design Mockups | May 12 | UX Team |
| 2 | Backend API | May 15 | Dev Team |
| 3 | Testing | May 20 | QA Team |
Borderless Table
Clean look without any cell borders (except header)
| User | Plan | Price |
|---|---|---|
| John Doe | Premium | $49/mo |
| Jane Smith | Basic | $19/mo |
| Mike Ross | Pro | $99/mo |
Contextual Rows
Color-coded rows to indicate state
| Details | Status | Date |
|---|---|---|
| Payment Received | Success | Just now |
| Awaiting Approval | Pending | 2 mins ago |
| Transaction Failed | Error | 5 mins ago |
Checkbox Selection
Rows with checkboxes for batch actions
| Name | Position | |
|---|---|---|
| Kevin Peterson | CEO | |
| Sarah Connor | CTO | |
| Kyle Rees | Engineer |
Primary Header
Header styled with the theme's primary color
| Order ID | Customer | Total |
|---|---|---|
| #ORD-556 | John Smith | $120.00 |
| #ORD-557 | Emily Davis | $85.50 |
| #ORD-558 | Michael Brown | $210.00 |
Captioned Table
Table including a semantic caption for accessibility
| User | Role | Active |
|---|---|---|
| Admin | Administrator | Yes |
| Editor | Content Editor | Yes |
| Viewer | Read Only | No |
Footer Table
Table with a footer summary row
| Item | Quantity | Unit Price | Total |
|---|---|---|---|
| Premium License | 2 | $50.00 | $100.00 |
| Support Package | 1 | $150.00 | $150.00 |
| Installation | 1 | $40.00 | $40.00 |
| Grand Total | $290.00 | ||