Tabs - CampEd UI

Docs

Tabs

Tabs component is a powerful navigation element that presents a set of layered sections of content, known as tab panels. Each tab panel is associated with a tab, and only one tab panel is displayed at a time. Users can switch between tabs to access different sets of content, making it an efficient and organized way to present information. The Tabs component enhances user experience by providing clear navigation and compartmentalizing content, ideal for scenarios where multiple views or functionalities need to be presented within a confined space.

Radix UI NPM

Account

Make changes to your account here. Click save when you're done.

Name

Username

Installation

yarn add @camped-ui/tabs

Usage

import { Tabs, TabsContent, TabsList, TabsTrigger } from "@camped-ui/tabs";

<Tabs defaultValue="account" className="w-[400px]">
  <TabsList>
    <TabsTrigger value="account">Account</TabsTrigger>
    <TabsTrigger value="password">Password</TabsTrigger>
  </TabsList>
  <TabsContent value="account">Make changes to your account here.</TabsContent>
  <TabsContent value="password">Change your password here.</TabsContent>
</Tabs>

Table Tag Input