Vibe UI
Initializing Vibe UI System...
Vibe UI

Data Table

Powerful table component with built-in search filtering, column sorting, row selection checkboxes, and pagination controls.

Data Table

Powerful table component with built-in search filtering, column sorting, row selection checkboxes, and pagination controls.

Preview

0 of 6 row(s) selected
EmailStatus
Alice Smithalice@example.comAdministratorActive
Bob Jonesbob@example.comEditorActive
Charlie Browncharlie@example.comViewerInactive
Diana Princediana@example.comAdministratorActive
Page 1 of 2 (6 items total)

Installation

pnpm dlx vibe-ui-kit@latest add data-table table button input checkbox
💡 Vibe UI Component Dependencies: This component requires other components to work correctlyPlease make sure you also install these Vibe UI component dependencies: table, button, input, checkbox

Variations

Glassmorphic Backdrop

0 of 6 row(s) selected
EmailStatus
Alice Smithalice@example.comAdministratorActive
Bob Jonesbob@example.comEditorActive
Charlie Browncharlie@example.comViewerInactive
Diana Princediana@example.comAdministratorActive
Page 1 of 2 (6 items total)

Neubrutalism Retro

0 of 6 row(s) selected
EmailStatus
Alice Smithalice@example.comAdministratorActive
Bob Jonesbob@example.comEditorActive
Charlie Browncharlie@example.comViewerInactive
Diana Princediana@example.comAdministratorActive
Page 1 of 2 (6 items total)

Neon Glow Accent

0 of 6 row(s) selected
EmailStatus
Alice Smithalice@example.comAdministratorActive
Bob Jonesbob@example.comEditorActive
Charlie Browncharlie@example.comViewerInactive
Diana Princediana@example.comAdministratorActive
Page 1 of 2 (6 items total)

Component Concept

Vibe UI's Data Table component provides an out-of-the-box data management grid with column sorting, live string searching, row checkbox selection, and pagination.

Contributors

JS
Jenish Sabhadiya

Theme Customizer

8px
@theme {
  --radius: 0.5rem;
  --glass-blur: 8px;
}
Changes apply instantly to this documentation workspace.
Data Table | Vibe UI