Skip to main content

Table

Composable data table with default, bordered, and minimal variants, density, alignment, striped rows, and TableSkeleton.

Default (muted borders)

TitleDateStatus
Morning pagesJun 1Draft
Weekend recapMay 28Published

Bordered cells (normal borders)

ItemQtyPriceTotal
Notebook — A5 ruled2$12.00$24.00
Fountain pen ink1$18.50$18.50
Shipping1$5.00$5.00

Striped rows

PlanPrice
Free$0
Pro$8/mo
Studio$18/mo

Compact

EntryWordsUpdated
Daily log8422h ago
Meeting notes312Yesterday

With status badges

TitleDateStatus
Morning pagesJun 1Draft
Weekend recapMay 28Published
Chapter outlineMay 20Review

With actions

TitleStatusActions
Morning pagesDraft
Weekend recapPublished

Minimal

MetricValue
Total entries128
Words written42,380
Current streak12 days

Bordered + striped (normal borders)

RegionQ1Q2Q3
North121511
South8109
West141316

Loading

Loading table

API

PropRequiredTypeDefaultDescription
themeOptionalSiteThemeatelierVisual theme.
variantOptional"default" | "bordered" | "minimal"defaultRow borders, full cell grid, or minimal chrome.
borderToneOptional"muted" | "normal"mutedBorder weight — muted hairlines by default; normal for full grid emphasis.
densityOptional"default" | "compact"defaultCell padding scale.
stripedOptionalbooleanAlternating row background on TableRow.
classNameOptionalstringLayout classes on the border/scroll wrapper (margin, max-width).
tableClassNameOptionalstringClasses on the inner table element (e.g. table-fixed).
alignOptional"left" | "center" | "right"Column alignment on TableHeadCell / TableCell.
TableHead / TableBody / TableRow / TableHeadCell / TableCellOptionalsubcomponentsComposable table sections; inherit variant and density from Table.
TableSkeletonOptionalcomponentLoading preset with configurable rows and columns.