Skip to documentation
DocsData DisplayTable
Component library

Data Display / COMPONENT

Table

Web · implementedDesktop · preview

Tampilan data tabular dengan rows dan columns.

import { Table } from "./vendor/syne-ui/index.js";TypeScript ready
Live preview
Members
NameRole
Ada LovelaceEngineer
Rafi PratamaDesigner
Nina PutriEngineer
Bima SantosoProduct
Fina RahmaDesigner

Interactive example · Try the controls with your mouse or keyboard.

Start with an example

Import the component and adapt it to your interface.

Example.tsxTSX
import { Table } from "./vendor/syne-ui/index.js";

export function Example() {
  return (
    <Table.Container><Table variant="striped"><caption>Members</caption><thead><tr><th scope="col">Name</th></tr></thead><tbody><tr><td>Ada</td></tr></tbody></Table></Table.Container>
  );
}
Make it yours

Use className and --syne-* tokens to match your design system.