Layout / COMPONENT

Tabs

Web · implementedDesktop · preview

Navigasi konten bertab dalam satu area panel.

import { Tabs } from "./vendor/syne-ui/index.js";TypeScript ready

Workspace overview

Move between tabs with the arrow keys.

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 { Tabs } from "./vendor/syne-ui/index.js";

export function Example() {
  return (
    <Tabs variant="pills" items={[{ value: "overview", label: "Overview", content: "Overview content" }, { value: "activity", label: "Activity", content: "Activity content" }]} />
  );
}

Make it yours

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