how to implement dark mode in website code example
Example: how to implement dark mode in website
/* You could simply toggle a global class on the body */
// JavaScript
button.addEventListener('click', () => {
document.body.classList.toggle('dark');
localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light');
});
if (localStorage.getItem('theme') === 'dark') {
document.body.classList.add('dark');
}
// CSS
/* Light mode */
body {
background: #fff;
color: #000;
}
/* Dark mode */
body.dark {
background: #000;
color: #fff;
}