<button class="btn-toggle">Toggle Dark-Mode</button>
<h1>Hey there! This is just a title</h2>
  <p>I am just a boring text, existing here solely for the purpose of this demo</p>
  <p>And I am just another one like the one above me, because two is better than having only one</p>
  <a href="#">I am a link, don't click me!</a>
* {
  font-family: Arial, Helvetica, sans-serif;
}

body {
  color: #222;
  background: #fff;
}
body.dark-theme {
  color: #eee;
  background: #121212;
}

a {
  color: #0033cc;
}
body.dark-theme a {
  color: #809fff;
}
const btn = document.querySelector(".btn-toggle");

btn.addEventListener("click", function () {
  document.body.classList.toggle("dark-theme");
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.