@rafcin/switch

A React component to view and switch between on or off states.

Usage no npm install needed!

<script type="module">
  import rafcinSwitch from 'https://cdn.skypack.dev/@rafcin/switch';
</script>

README

Switch

The Switch component is used as an alternative for the checkbox component, switch between enabled or disabled states.

Installation

yarn add @rafcin/switch

# or

npm i @rafcin/switch

Import component

import { Switch } from "@rafcin/switch"

Usage

<Switch />

Sizes

Pass the size prop to change the size of the switch.

<>
  <Switch size="sm" marginLeft="1rem" colorScheme="green" />

  <Switch size="md" marginLeft="1rem" colorScheme="green" />

  <Switch size="lg" marginLeft="1rem" colorScheme="green" />
</>

Switch background-color

You can change the checked background color of the switch by passing the colorScheme prop

<Switch colorScheme="blue" />

Resources