Switch

A switch is an interactive element that allows users to switch between two states or options with a single action.

Overview

The purpose of switches is to offer users a quick and straightforward method to switch between two distinct options or states. Switches enhance the user experience by providing a clear and efficient way to make selections or enable/disable functionality.

Switches are commonly used to enable or disable settings, switch between modes or perform binary actions in user interfaces. When users interact with switches, they change their appearance to indicate the current state or selection.

A switch that is currently in the off position, with a label positioned to the left.

Resources

Figma Web Component	Stable
Figma Web Documentation	Stable
Figma App Component	Stable
Figma App Documentation	Stable
Web Components	Stable
Vue [Fozzie]	Stable
React [Snacks]	Stable
iOS JustUI [UI Kit]	Stable
iOS PIE [SwiftUI]	Stable
Android PIE [Compose & Views]	Stable