Table

A table displays large data sets in a simple grid with column headers.

Demos

Basic

Basic screenshot

Sortable

Sortable screenshot

Expandable

Expandable screenshot

Compact

Compact screenshot

Compound expansion

Compound expansion screenshot

Loading state demo

Loading state demo screenshot

Empty state

Empty state screenshot

Static bottom pagination

Static bottom pagination screenshot

Column management modal

Column management modal screenshot
Sticky header screenshot

Sticky first column

Sticky first column screenshot

Sticky multiple columns

Sticky multiple columns screenshot

Sticky header and multiple columns

Sticky header and multiple columns screenshot

Sticky header and last column

Sticky header and last column screenshot

Cell with image alignment

By default, table cell alignment is set to baseline. This retains vertical alignment with varying text size, but can cause visual inconsistencies with images. The vertical alignment of images within table cells may need to be specified to provide proper alignment.

Cell with image alignment screenshot