Visit complete Design System roadmap

← Back to Topics List

Input Switch

Input switches toggle the state of a single item. Compared to the input checkbox, their changes usually apply without any additional submission.

  • Checked State: Used when an input switch is turned on. It’s better to provide an additional way to indicate the checked state besides changing its colour when applicable.
  • Disabled State: Prevents interacting with an input switch.
  • Label: There should be a text label linked with the switch field. Clicking the label should also trigger the input selection.
  • Keyboard State: A switch selection should be triggered when the Space key is pressed.

Roadmaps Guides Videos About YouTube

roadmap.sh by Kamran Ahmed

Community created roadmaps, articles, resources and journeys to help you choose your path and grow in your career.

© roadmap.sh · FAQs · Terms · Privacy