JSFiddle - React, Tailwind, and code Playground

HTML

<link id="pagestyle" rel="stylesheet" type="text/css" href="light.css">
    
<div class="style-changer">
    <span>Change Style:</span>
    <button class="white" onclick="localStorage.setItem('lightWasPressed', 'true');localStorage.setItem('darkWasPressed', 'false');">Light</button>
    <button class="black" onclick="localStorage.setItem('darkWasPressed', 'true'); localStorage.setItem('lightWasPressed', 'false');">Dark</button>
</div>

JavaScript

function swapStyleSheet(sheet){ 
    document.getElementById('pagestyle').setAttribute('href', sheet);
}
function darkWasPressed() {
if (localStorage.lightWasPressed = true;) {
        swapStyleSheet('black.css')
    }   
}
function lightWasPressed() {
if (localStorage.darkWasPressed = true;) {
        swapStyleSheet('black.css')
    }   
}