JSFiddle - React, Tailwind, and code Playground

by António Almeida

HTML

<p>Some Text to preview</p>
<button id="switcherDark">Switch to Dark Mode</button>
<button id="switcherLight">Switch to Light Mode</button>

CSS

.myFirstColorSet {
        background-color: #FFF;
        color: #000;
        ...
    }
    
    .mySecondColorSet {
        background-color: #000;
        color: #FFF;
        ...
    }

JavaScript

document.body.className = "myFirstColorSet";

document.getElementById("switcherDark").addEventListener("click", switchDark, false);
document.getElementById("switcherLight").addEventListener("click", switchLight, false);

function switchDark(){
    document.body.className = "mySecondColorSet";
}

function switchLight(){
    document.body.className = "myFirstColorSet";
}