A cutesy dark mode toggle button for React
react-dark-mode-toggle
A super cutesy dark mode toggle button for React. Inspired by overreacted.io.
? Getting Started
Using npm
:
npm i react-dark-mode-toggle
Using yarn
:
yarn add react-dark-mode-toggle
✨ Usage
import React, {useState} from "react";
import DarkModeToggle from "react-dark-mode-toggle";
export default () => {
const [isDarkMode, setIsDarkMode] = useState(() => false);
return (
<DarkModeToggle
onChange={setIsDarkMode}
checked={isDarkMode}
size={80}
/>
);
};
? Props
Prop | Type | Default | Required |
---|---|---|---|
onChange |
func | value => null |
No |
checked |
boolean | false |
No |
size |
number | 80 |
No |
speed |
number | 1.3 |
No |
Note, this is not a dark mode theme implementation; it's just a button! You'll need to mix this with a management solution such as use-dark-mode.