clari / react-ios-switch

React switch component https://clari.github.io/react-ios-switch

react-ios-switch

Demo

CodePen

Features

• Drag or click to toggle
• Works with labels

Usage

import Switch from 'react-ios-switch';

// Simple usage
<Switch
  checked={checked}
  onChange={checked => {}}
/>

// All props (defaults shown)
<Switch
  checked={undefined}
  className={undefined}
  disabled={undefined}
  handleColor="white"
  name={undefined}
  offColor="white"
  onChange={() => {}}
  onColor="rgb(76, 217, 100)"
  pendingOffColor={undefined}
  pendingOnColor={undefined}
  readOnly={undefined}
  style={undefined}
/>

Development

# Install packages
yarn

# Start server
yarn start

# Visit http://localhost:8080

Inspirations

• Switchery
• Human Interface Guidelines