JSFiddle - React, Tailwind, and code Playground

by Drew Christensen

HTML

<div>
  <main>
    <h1>Hi</h1>
    <p>Hello </p>
  </main>
</div>

CSS

html, body {
  margin: 0;
  padding: 0;
}

* {
  transition: color 200ms, background-color 200ms;
}
/* 
.preload * {
  transition: none;
} */

.dark main {
  color: white;
  background-color: black;
}

.light main {
  color: black;
  background-color: white;
}

JavaScript

window.onload = () => {
  let div = document.getElementsByTagName("div")[0];
  div.classList.add("dark");
};