Components
Toggle
A two-state button.
Toggle is built on the Base UI Toggle primitive. It renders a button that switches between pressed and unpressed states.
Installation
pnpm dlx shadcn@latest add https://faber-ui.vercel.app/r/toggle.jsonUsage
"use client";
import { Toggle } from "@/components/ui/toggle";
export default function Example() {
return <Toggle>Bold</Toggle>;
}Examples
Default
Pressed
Sizes
Variants
API
Each part forwards every prop of what it is built on, including className and render where Base UI supports it. The props column lists only what Faber UI adds on top.
| Part | Built on | Props |
|---|---|---|
Toggledata-slot="toggle" | ToggleBase UI | — |
Changelog
- v0.3.0Button, Toggle, Tabs and NavigationMenu ship their style configs from @workspace/ui/lib/*-variants so component files export only components.minor
- v0.3.0KbdGroup is typed as a kbd element, Combobox imports its Base UI subpath, the motion lib mirrors the exit easing and travel tokens, and the chart item declares its react-is peer.patch
Last updated on