Table

A responsive table component for displaying tabular data.

Basic Table

A simple table with headers and rows.

InvoiceStatusMethodAmount
INV001PaidCredit Card$250.00
INV002PendingPayPal$150.00
INV003UnpaidBank Transfer$350.00
INV004PaidCredit Card$450.00
INV005PaidPayPal$550.00

Table with Footer

Table including a footer row with totals.

A list of your recent invoices.
InvoiceStatusMethodAmount
INV001PaidCredit Card$250.00
INV002PendingPayPal$150.00
INV003UnpaidBank Transfer$350.00
INV004PaidCredit Card$450.00
INV005PaidPayPal$550.00
INV006PendingBank Transfer$200.00
INV007UnpaidCredit Card$300.00
Total$2,250.00

With Status Badges

Table with styled status indicators.

Student IDNameProgramGPAStatus
STU001Aminata KoromaComputer Science3.85Active
STU002Mohamed SesayBusiness Admin3.62Active
STU003Fatmata BanguraEngineering3.91Active
STU004Ibrahim KamaraMedicine3.78On Leave
STU005Mariama ContehLaw3.95Active

With Row Actions

Table with action buttons in each row.

NameEmailRoleActions
John Doejohn@example.comAdmin
Jane Smithjane@example.comEditor
Bob Johnsonbob@example.comViewer

Selectable Rows

Table with checkbox selection.

TaskPriorityStatusAssignee
Update documentationHighIn ProgressJohn Doe
Fix navigation bugMediumTodoJane Smith
Design new homepageLowDoneBob Johnson

Sortable Headers

Table with sortable column headers.

Alice JohnsonEngineering$120,0002022-01-15
Bob WilliamsMarketing$85,0002021-06-20
Carol DavisSales$95,0002023-03-10