npm install tailwind-theme-toggle
or
yarn install tailwind-theme-toggle
Usage
Step 1.
// tailwind.config.js
module.exports = {
darkMode: "class",
// others
};
Step 2.
in React.s/Next.js
Recommended this package for react/nextjs project, click here
import themeToggler from "tailwind-theme-toggle";
const Button = () => <button onClick={themeToggler}> Toggle </button>;
in Vue.js/Nuxt.js
import themeToggler from "tailwind-theme-toggle";
<button @click="themeToggler">Greet</button>
in raw HTML/JavaScript
import themeToggler from "tailwind-theme-toggle";
const button = document.getElementById("togglerButton");
button.addEventListener("click", themeToggler);
Also you can check theme
const theme = localStorage.getItem("theme");
const isDark = theme === "dark";