Skip to content

Instantly share code, notes, and snippets.

@blainelewis1
Created September 11, 2020 06:21
Show Gist options
  • Save blainelewis1/068e6da0d8a4c71ca32d689b798a21fa to your computer and use it in GitHub Desktop.
Save blainelewis1/068e6da0d8a4c71ca32d689b798a21fa to your computer and use it in GitHub Desktop.
Hook for adding dark mode to any project.
import { useEffect } from "react";
export function useDarkMode(isDarkMode = true) {
useEffect(() => {
if (isDarkMode) {
document.body.style.backgroundColor = "black";
document.body.style.filter = "invert(1) hue-rotate(180deg)";
} else {
document.body.style.backgroundColor = "white";
document.body.style.filter = "";
}
return () => {
document.body.style.backgroundColor = "white";
document.body.style.filter = "";
};
}, [isDarkMode]);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment