Components
Action
SwitchToggle

SwitchToggle

A basic on/off switch. Useful for standalone “off/on” options.

Usage

Use a SwitchToggle for:

  • Standalone “on/off” options
  • Toggling settings in settings pages (e.g. “Notifications on/off”)

Never use a SwitchToggle for:

  • “Agree/disagree” checkboxes (use a Checkbox)
  • Form inputs (alongside other fields) (use a Checkbox)
  • “Option A/Option B” choices (switches should always indicate “on/off”) (use a Radio)

Props

NameTypeDescription
activeColorstringChange the active color of the switch.
variantstringdefault or large

Further Reading