Skip to content

A simple component to switch between dark and light themes

Notifications You must be signed in to change notification settings

forgng/react-toggle-theme

Repository files navigation

react-toggle-theme

alt text

A simple component to switch between dark and light themes

Install

yarn add react-toggle-theme
npm install --save react-toggle-theme

Usage

import React from "react";
import ToggleTheme from "react-toggle-theme";

function App() {
  const [currentTheme, setCurrentTheme] = React.useState("light");

  React.useEffect(() => {
    console.log("Toggle theme");
    // Handle theme logic
    // e.g. update localstorage, set window.THEME = theme, etc.
  }, [currentTheme]);

  return (
    <div
      className={"app-container"}
      style={{ backgroundColor: currentTheme === "light" ? "#000" : "#fff" }}
    >
      <ToggleTheme selectedTheme={currentTheme} onChange={setCurrentTheme} />
    </div>
  );
}

export default App;

About

A simple component to switch between dark and light themes

Resources

Stars

Watchers

Forks

Packages

No packages published