Tabs

Accessible tabbed panels built on Radix Tabs with roving-focus keyboard navigation, horizontal or vertical orientation, and automatic or manual activation.

tabsnavigationpanelsradixkeyboard

Open preview in new tab

How do I install the Tabs component?

Run the command below in a project with the shadcn CLI. It copies the component source into your repo and installs its dependencies.

npx shadcn@latest add https://www.saasuji.com/r/tabs.json

Dependencies

Also available as a markdown reference for AI agents: /components/tabs.md

Related components

Accordion

Vertically stacked collapsible sections built on Radix Accordion, with single or multiple open items, keyboard navigation, and animated expand and collapse.

Carousel

A touch-friendly slide carousel built on Embla with keyboard support, previous/next controls, and horizontal or vertical orientation.

Sheet

A panel that slides in from any edge, built on the Radix Dialog primitive with overlay, header, footer, title, description, and a corner close button.