Switch

A switch toggles a single setting on or off, taking effect immediately. RhombusKit's <rhombus-switch> wraps Material's <mat-slide-toggle> and drives its track from the dedicated --switch-track-on / --switch-track-off contract tokens, so it re-skins with the active theme.

When to use

  • Use a switch for an instant-effect on/off setting (“Email notifications”, dark mode) where no Save step follows. For an option that is only committed on submit, prefer Checkbox.
  • Bind [(checked)] for lightweight local state, or pass a FormControl<boolean> via [control] to join a reactive form.

Example

When not to use

  • For an option that is only committed when a form is submitted, use a Checkbox — switches imply an instant, save-less effect.
  • For choosing exactly one option from a mutually exclusive set, use a Radio group, not several switches.
  • For triggering a one-off action rather than persisting a state, use a Button.

Related components

  • Checkbox — committed-on-submit boolean with the same control model.
  • Radio — single choice from a set.
  • Theme Toggle — a purpose-built switch for light/dark mode.

Was this page helpful?