Tabs

A headless tabs primitive for organizing content into switchable panels.

Basic

A simple tab interface. Use TabsList with TabsTrigger components for navigation and TabsContent for each panel.

Controlled

Control the active tab externally via @bind-Value. The Value parameter determines which TabsContent panel is visible.

Anatomy

Loading example…

Keyboard Navigation

  • / - Navigate tabs (horizontal)
  • / - Navigate tabs (vertical)
  • Home - First tab
  • End - Last tab
  • Tab - Move to content panel