Skip to content

Instantly share code, notes, and snippets.

@lawrencecchen

lawrencecchen/useTheme.ts

Created August 16, 2022 00:14
Show Gist options
  • Save lawrencecchen/b9dd8f9558e9e0c8feac74d49f73dfdf to your computer and use it in GitHub Desktop.
Save lawrencecchen/b9dd8f9558e9e0c8feac74d49f73dfdf to your computer and use it in GitHub Desktop.
Download ZIP
useTheme() for react/tailwind (using usehooks-ts)
Raw
useTheme.ts
// npm i usehooks-ts
import { useEffect } from "react";
import { useDarkMode } from "usehooks-ts";
export function useTheme() {
const theme = useDarkMode();
useEffect(() => {
if (theme.isDarkMode) {
document.body.classList.add("dark");
} else {
document.body.classList.remove("dark");
}
}, [theme.isDarkMode]);
return theme;
}
// <body>
// <script>
// if (!!window.localStorage.getItem("usehooks-ts-dark-mode")) {
// document.body.classList.add("dark");
// }
// </script>
// </body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment