Tabs
A set of layered sections of content, known as tab panels, that are displayed one at a time. Built on Base UI Tabs primitive.
Account settings here.
Installation
npx shadcn add tabs --registry https://ui.ch.sh/r
Usage
import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs"
export default function Example() {
return (
<Tabs defaultValue="account">
<TabsList>
<TabsTrigger value="account">Account</TabsTrigger>
<TabsTrigger value="password">Password</TabsTrigger>
</TabsList>
<TabsContent value="account">
Account settings.
</TabsContent>
<TabsContent value="password">
Password settings.
</TabsContent>
</Tabs>
)
}Examples
Line Variant
Overview content.