Switch

Use in forms to toggle between two states.

Dark mode

Features

Accessible, easy to compose and customize.

Style and animate both frame and thumb.

Sizable & works controlled or uncontrolled.

import { Switch } from 'tamagui'

export default () => (
  <Switch size="$4">
    <Switch.Thumb animation="bouncy" />
  </Switch>
)

Switchs extend Stack views inheriting all the Tamagui standard props, plus:

Prop	Type	Default
`labeledBy`	`string`
Set aria-labeled-by.
`name`	`string`
Equivalent to input name.
`value`	`string`
Give it a value (for use in HTML forms).
`checked`	`boolean`
Control the input.
`defaultChecked`	`boolean`
Uncontrolled default value.
`required`	`boolean`
Sets aria-required.
`onCheckedChange`	`(checked: boolean) => void`