---
id: switch
title: Switch
---

import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
import Usage from "../component_usage/Switch.mdx";
import Play from "@site/playground/Switch/switch.playground";

Switch represents user's decision of a process and indicates whether a state is on/off.
Switch is a controlled component that requires an `onValueChange` to update the `value` prop.
This renders a `boolean` value. React native elements provide you with additional `theme` and `color` support in the Switch Button.
This component inherits [all native Switch props that come with a standard React Native Switch element](https://reactnative.dev/docs/switch.html).

## Import

```tsx
import { Switch } from "@rneui/themed";
```

## Usage

<Usage />

## Props

:::note
Includes all [View](https://reactnative.dev/docs/view#props) props.
:::

<div class='table-responsive'>

| Name    | Type   | Default   | Description                        |
| ------- | ------ | --------- | ---------------------------------- |
| `color` | string | `primary` | The color of the Switch component. |

</div>

## Playground

<Play />
