Switch

SfSwitch allows users to control a boolean value. This can be used to enable/disable features, especially on mobile.

It uses an <input type="checkbox"> with additional stylings to give it the appearance of a switch.

From a functional perspective, it is similar to the SfCheckbox component, except the checkbox can handle indeterminate states. The two possible values are true and false.

Examples

Switch without label

Switch base component without a label.

Switch with leading control

Switch with trailing control

Switch component with a label align on the left.

Playground