Skip to Content

switch

ui

A control that allows the user to toggle between a checked and not checked state.

Use cases

  • On/off toggles
  • Feature flags
  • Settings preferences
  • Dark mode toggle

Variants & sizes

Sizes

defaultsm

Features

  • Animated thumb transition
  • Keyboard accessible (Space to toggle)
  • Two sizes for different contexts

Preview

Interactive preview with light/dark mode toggle. Switch to Code tab to view the full source.

Installation

npx shadcn@latest add https://registry.mukoko.com/api/v1/ui/switch

Dependencies

radix-ui

API

Fetch this component's metadata and source code from the registry API.

GET/api/v1/ui/switch

Source

components/ui/switch.tsx