Skip to content

Instantly share code, notes, and snippets.

@Nebelung-Dev

Nebelung-Dev/darkmode.html

Created August 19, 2022 18:26
Show Gist options
  • Save Nebelung-Dev/9d1bfd5f2756f26249d8bc6c2e94cdbb to your computer and use it in GitHub Desktop.
Save Nebelung-Dev/9d1bfd5f2756f26249d8bc6c2e94cdbb to your computer and use it in GitHub Desktop.
Download ZIP
Raw
darkmode.html
<body>
<h1>Some Text</h1>
<button onclick="toggleTheme()">Toggle Theme</button>
</body>
<style>
body {
--color: black;
--background: white;
background: var(--background);
color: var(--color);
}
.dark {
--color: white;
--background: black;
}
</style>
<script>
if (localStorage.getItem("theme")) {
document.body.classList.toggle("dark")
}
function toggleTheme() {
document.body.classList.toggle("dark")
localStorage.setItem("theme", document.body.classList.contains("dark") ? "dark" : "")
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment