Switch

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} />;