Switch

High-fidelity toggle control for instant system changes.

Preview & Interactive Laboratory

Usage & Implementation

<Switch className="bg-primary" />
React / Tailwind

Granular Customization

1

Switch Track

The background rail of the switch.

className={`className`}
2

Switch Thumb

The moving circular indicator.

className={`className='[&>span]:bg-white'`}