> For the complete documentation index, see [llms.txt](https://docs.thunkable.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.thunkable.com/snap-to-place/switch.md).

# Switch

## Switch Overview

A switch is a component that has two settings, true and false. You can get your app to do specific tasks only if the switch is set to true. 

![](/files/-LAn68KdTsbXiRGsjXH9)

## Getting Started

Each time the switch is clicked the value will change. The value returned will only ever be `true` or `false`. To test this for yourself you can use the following blocks.

![](/files/-MWiX9j8t3LVznuX3mHm)

In the following example, the user can only advance to `Screen2` if the acknowledge they have accepted the terms and conditions by clicking on the switch.

![](/files/-MWiXQwteEJ16aJq86ov)

| Event           | Description                                                                                                  |
| --------------- | ------------------------------------------------------------------------------------------------------------ |
| On Value Change | By default, the switch `newValue` will be set to `false`. If turned on, the `newValue` will be set to `true` |
| Value           | If on, value is set to `true`; if off, `false`                                                               |
| Disabled        | If set to `true`, switch will be disabled                                                                    |

## Style the Switch

You can customize the switch with the following properties:

* **Tint Color:** Color of the switch track when switch is set to off
* **On Tint Color:** Color of the switch track when switch set to on 
* **Thumb Tint Color:** Color of the switch thumb

## Events 

### On Value Change

![](/files/-MWiXu-th3Ep7LerkKjl)

This event fires every time the switch is clicked.

## Properties

### Disabled 

![](/files/-MWZG3NqO-Qepj7sp5hj)

The disabled property is used to set whether or not the button is "clickable". Expected values for this property are:

* True
* False

### Height 

![](/files/-MWZG4gitjHowTsf_j_L)

The set and get height blocks work with the Height property of the switch component.

### On Tint Color 

![](/files/-MWZG6DZJ4tRxXoh61Dy)

Change the "active" color of the switch.

### Thumb Tint Color 

![](/files/-MWZG7d5VsHWrnTT99VE)

Change the color of the switch

### Tint Color 

![](/files/-MWZGEHN_gpbrhgSKHxM)

Change the "inactive" color of the switch

### Value 

![](/files/-MWZGFgk_NS1U31Z65lg)

Change the state (on or off) of the switch

### Visible 

![](/files/-MWZGGpog3cyq9npq5Qo)

Show or hide the switch on the screen.

### Width 

![](/files/-MWZGI49tqFn8CnxjOQa)

The set and get height blocks work with the Width property of the switch component.

### X 

![](/files/-MWZGJHPWiFk0A6jxttz)

### Y

![](/files/-MWZGKPvI15ZDZMgD4dU)