# Switch

A switch element toggles on and off.

<figure><img src="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FBs2R3W3ymuWMOMaMSbde%2Fimage.png?alt=media&#x26;token=463754af-0713-434d-a9c0-426652d160a0" alt=""><figcaption></figcaption></figure>

## Properties

![](https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2F4vxV64alIbi6TPJKYGNe%2Fimage.png?alt=media\&token=c7a39899-494a-463f-80cc-b098e7cf5efd)

**Form item name:** This is the name that the encompassing form will use to access the output of the checkbox. See [custom-form](https://docs.acho.io/app-builder/app-construction/elements/form-elements/custom-form "mention") for how it's used.

**Mode:** Change between a switch or checkbox display of the element.

**Default value:** Set whether the switch will by default be on or off.

**Active and Inactive text:** Text displayed next to the switch when it is on or off.

**Active and Inactive color:** Color of the active or inactive text.

**Size:** Select a size for the element.

**Disabled:** When toggled on, the user will not be able to change the switch.

See [form-check](https://docs.acho.io/app-builder/app-construction/elements/form-check "mention") for data validation.

See [tooltip](https://docs.acho.io/app-builder/app-construction/elements/tooltip "mention") for tooltip configurations.

## Output

The output of a switch is true/false (boolean).

## Supported Events

**Switch Value:** Triggered when a user switches the value.

## Supported Actions

**Set Value:** Set the value of the element (true/false)

**Set Validate Result:** Set whether the input is valid.

**Set Data:** Change element data. See [data-store](https://docs.acho.io/app-builder/app-construction/data-store "mention").

**Set Loading:** Set loading animation. See [set-loading-animations](https://docs.acho.io/app-builder/popular-use-cases/set-loading-animations "mention").

{% hint style="info" %}
Visit [interactions](https://docs.acho.io/app-builder/app-construction/interactions "mention") for more on events and actions.
{% endhint %}
