Switch
Toggle between two states in user interfaces.
<.switch field={f[:active]} />
Label
Add clear labels to switches for improved usability and context.
<.switch label="Remember my password" />
Sizes
Offer multiple switch sizes to suit different layouts and preferences.
<.switch size="sm" />
<.switch />
<.switch size="lg" />
Disabled
Show switches in a disabled state for unavailable functionality.
<.switch disabled />
Colors
Customize switch colors to match your design system and convey meaning.
<.switch checked color="red" />
<.switch checked color="orange" />
<.switch checked color="amber" />
<.switch checked color="yellow" />
<.switch checked color="lime" />
<.switch checked color="green" />
<.switch checked color="emerald" />
<.switch checked color="teal" />
<.switch checked color="cyan" />
<.switch checked color="sky" />
<.switch checked color="blue" />
<.switch checked color="indigo" />
<.switch checked color="violet" />
<.switch checked color="purple" />
<.switch checked color="fuchsia" />
<.switch checked color="pink" />
<.switch checked color="rose" />
<.switch checked color="gray" />