Shadcn.io is not affiliated with official shadcn/ui
Square Switch
Square switch toggle with rounded-sm styling for sharp corners minimal aesthetic built with shadcn/ui
Round switches everywhere—sometimes you need edges. This React square switch uses shadcn/ui Switch with rounded-sm className override for squared corners on track and thumb. Built with Radix UI primitives and Tailwind utilities, the sharp-cornered aesthetic fits minimal, modern, or technical interfaces—perfect for design tools, code editors, developer dashboards, settings panels with geometric design language, or any interface where square UI elements establish visual consistency better than default rounded pill-shaped toggles.
Square Switch preview
Installation
Related Components
Standard Switch
Default rounded pill switch
Square Switch with Text
Square toggle with ON/OFF labels
Square Switch with Label
Square switch with external label
Square Theme Toggle
Square switch with theme icons
Checkbox
Square checkbox control
Outline Button
Minimal button styling
FAQ
Was this page helpful?
Sign in to leave feedback.