Toggle
A two-state button that can be either on or off.
Loading example…
Installation
bunx --bun shadcn@latest add @sui/toggleInstall with the shadcn CLI or use the shared @workspace/ui package. Follow the installation guide to configure the registry, load styles, and choose import aliases.
Usage
import { Toggle } from "@workspace/ui/components/toggle"<Toggle>Toggle</Toggle>Outline
Use variant="outline" for an outline style.
Loading example…
With Text
Loading example…
Size
Use the size prop to change the size of the toggle.
Loading example…
Disabled
Loading example…
RTL
To enable RTL support in shadcn/ui, see the RTL configuration guide.
Loading example…
API Reference
See the Base UI Toggle documentation.