Playground

Tabs

Default tabs use an elevated indicator.

Line tabs keep the navigation lightweight.

Pill tabs work well for nested or inline contexts.

ToggleGrid

Switch

Off

Base UI + CSS-anchored value

Label

25

NumberChip

∙ Scrub to adjust value

Amount

px

Slider

│4

button-demo.tsx

export function ButtonDemo() {
  return <Button variant="elevated">Save</Button>;
}

ImageToggle

Video Player

Loading video player...

Drawer