Shadcn.io is not affiliated with official shadcn/ui
Checked Switch
Switch toggle with defaultChecked prop to set initial checked state without controlled state management built with shadcn/ui
Sometimes you need a toggle that starts on—user preferences remembered, features enabled by default, opt-out settings. This React switch uses defaultChecked prop with shadcn/ui Switch component for uncontrolled initial state. Built with Radix UI primitives, it starts checked but users can toggle freely without React state management—perfect for default-on features, remembered preferences, opt-out checkboxes, or any interface where initial checked state matters but you don't need to track changes in React until form submission.
Checked Switch preview
Installation
Related Components
Default Switch
Unchecked switch without defaultChecked
Small Switch
Compact sized switch variant
Disabled Switch
Non-interactive disabled state
Square Switch
Square corners minimal aesthetic
Square Switch with Label
Labeled switch with htmlFor linkage
Checked Checkbox
Checkbox with defaultChecked
FAQ
Was this page helpful?
Sign in to leave feedback.