Skip to main content

React Native Switchery

An iOS-inspired, highly customizable switch component for React Native with smooth animations, elastic transitions, and first-class accessibility support.

Get StartedAPI Reference
React Native Switchery demo showing smooth switch animations

Quick Start

Get up and running with React Native Switchery in just a few steps

1

Install the package

Install react-native-switchery using your preferred package manager:
npm install react-native-switchery
2

Import the Switch component

Import the Switch component in your React Native file:
import { Switch } from 'react-native-switchery';
3

Use the component

Add the Switch to your component with controlled state:
import React, { useState } from 'react';
import { View } from 'react-native';
import { Switch } from 'react-native-switchery';

export const MyComponent = () => {
  const [enabled, setEnabled] = useState(false);

  return (
    <View>
      <Switch
        value={enabled}
        onValueChange={setEnabled}
        variant="primary"
      />
    </View>
  );
};

Key Features

Everything you need for beautiful, accessible switch components

iOS-Style Animation

Smooth thumb glides and elastic pill fill animations that feel native on both iOS and Android

Color Variants

Five built-in variants (primary, info, success, warning, danger) or customize with your own colors

Flexible Sizing

Four preset sizes from mini to large, with fine-grained control over dimensions

Accessibility Ready

Full VoiceOver and TalkBack support with proper ARIA roles and state management

Explore Documentation

Deep dive into guides, API reference, and examples

Variant Styles

Learn how to use built-in color variants and customize your switch appearance

View guide

API Reference

Complete documentation of all props, types, and configuration options

View API docs

Basic Examples

Simple, practical examples to get started quickly with common use cases

View examples

Advanced Examples

Complex patterns and integrations for sophisticated use cases

View examples

Ready to get started?

Install React Native Switchery and start building beautiful switch components in minutes

View Installation Guide

Build docs developers (and LLMs) love

Get started for freeTalk to us