---
category: Data
---

The working surface of the product half. The header row is the eyebrow — 13px/600
uppercase at 1.82px tracking — and it carries the count of what is below it, so a
reader knows the table's size before scrolling it. Numeric columns are
right-aligned with tabular figures.

**A row tints; it does not lift.** Hover fills with `--surface` and nothing moves,
which is the whole hover vocabulary of this pack.

```tsx
<DataTable caption="Articles (14)" columns={[…]} rows={…} />
```