Tabs

TabsList is the container (Level 2). TabsTrigger stays flat (Level 1) to avoid shadow stacking.

Basic Usage

Design
Active trigger uses ink fill. The list owns the boundary to avoid border stacking.

Segmented (Compact)

Variants

TabsList: Default
Level 2 container with shadow.
TabsList: Inset
Removes shadow for nested usage.

Best Practices

Inside a Card (Level 3), keep TabsList inset and let the Card own elevation.

Paper Cut Theme
Card owns elevation; triggers become quiet controls, active state gets a default shadow.

Anti-patterns

A shadowed TabsList inside a shadowed Card stacks elevation.

❌ Nested default TabsList