Switch Group Form

A switch group form with multiple toggle fields demonstrating grouped boolean settings

This switch group form shows how to handle multiple boolean settings in a single form with visual separation. Perfect for privacy settings, feature toggles, or any grouped on/off preferences. Uses border separators between switches for clear visual structure.

Switch Group Form preview

Scroll to load preview

Installation

Install

Pro block

npx shadcn@latest add https://www.shadcn.io/r/form-switch-group.json

npx shadcn@latest add https://www.shadcn.io/r/form-switch-group.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/form-switch-group.json

bunx shadcn@latest add https://www.shadcn.io/r/form-switch-group.json

Switch Basic

Simple on/off toggle switch

Switch With Description

Switch toggle with detailed description

Switch Card

Switch toggles in card containers

Switch Responsive

Responsive switch layout adapting to screen size

Switch Nested

Conditional fields revealed by switch toggle

Toggle Feature Flags

Feature flag management toggles

FAQ

Last updated on March 24, 2026

Was this page helpful?

Destructive Action Switch Form

A form with dangerous toggle switches requiring careful consideration before enabling

Nested Conditional Switch Form

A switch that reveals additional form fields when enabled with conditional rendering

Switch Group Form