Tabs are a navigational component that allows users to move easily between groups of related content.
The TabsPill component is a Base UI component.
<Tabs defaultValue="cat"> <TabsPillList> <TabsPillTab value="cat">🐱 Cat</TabsPillTab> <TabsPillTab value="fox">🦊 Fox</TabsPillTab> <TabsPillTab value="lion">🦁 Lion</TabsPillTab> <TabsPillTab value="dog">🐶 Dog</TabsPillTab> <TabsPillTab value="tiger">🐯 Tiger</TabsPillTab> <TabsPillTab value="panda">🐼 Panda</TabsPillTab> <TabsPillTab value="koala">🐨 Koala</TabsPillTab> <TabsPillTab value="monkey">🐵 Monkey</TabsPillTab> <TabsPillTab value="frog">🐸 Frog</TabsPillTab> </TabsPillList> <Spacer height={16} /> <TabsPanel value="cat">🐱 Cat</TabsPanel> <TabsPanel value="fox">🦊 Fox</TabsPanel> <TabsPanel value="lion">🦁 Lion</TabsPanel> <TabsPanel value="dog">🐶 Dog</TabsPanel> <TabsPanel value="tiger">🐯 Tiger</TabsPanel> <TabsPanel value="panda">🐼 Panda</TabsPanel> <TabsPanel value="koala">🐨 Koala</TabsPanel> <TabsPanel value="monkey">🐵 Monkey</TabsPanel> <TabsPanel value="frog">🐸 Frog</TabsPanel></Tabs>