Skip to main content

​
Overview

Switch is a React Native component designed for creating a switch or toggle control. It’s built on top of React Native’s Switch. It can be customized with Tailwind classes through the className prop.

​
Preview

  • Preview
  • Code

Light mode

Dark mode

​
Installation

  • CLI
  • Manual
npx nativecn-ui add Switch

​
Properties

  • className?: string (optional) - The classes for the switch.
  • See React Native’s Switch props

​
Usage

​
Basic Usage

Here’s how you can use the Switch component: 
const [isEnabled, setIsEnabled] = useState(false);

return <Switch onValueChange={setIsEnabled} value={isEnabled} />;