Components / Tabs

Tabs

A layered interface component used to switch between views. Features a rounded-full pill switcher with a floating active indicator that smoothly slides between triggers.

Account

Make changes to your account here.

Name

Username

Password

Change your password here. After saving, you'll be logged out.

Current Password

New Password

Empty State Example

Anatomy

Component Structure

Part Key	Description	GarisPola Characteristic
Tabs	The root container.	Manages state via data attributes.
TabsList	Container for trigger buttons.	`rounded-full` pill shape with internal floating indicator.
TabsTrigger	Individual tab button.	Minimal styling, relying on the floating indicator (white pill) for "active" state.
TabsContent	The panel content.	Has a subtle spring-up animation on entrance.