JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<!-- Start Demo Style -->
<div id="demo">
<ul>
  <li><a id="darkstyle" href="#DarkStyle">Dark Style</a></li>
  <li><a id="gradientstyle" href="#Gradient">Gradient Style</a></li>
</ul>
</div>
<!-- End Demo Style -->
<div id="main-wrapper">
    </div>
</body>

CSS

<link rel="stylesheet" type="text/css" class="dark" href="https://gist.githubusercontent.com/agusmakmun/2ac5c1845bb85b6390e6/raw/9b39531d5e6a905f8d73b1199d39fa87099db3ec/Rugest%20Premium%20Dark%20Style.css"/>

<link rel="stylesheet" type="text/css" class="gradient" href="https://gist.githubusercontent.com/agusmakmun/b800073a69e574cd9cad/raw/5adadbd52599b73096cad2da840cd7df640aa1df/Rugest%20Premium%20Gradient%20Style.css"/>



/* Start Demo Style */
#demo {
position:fixed;
  }
#demo ul {

  }
#demo ul li {

  }
#demo ul li a {

  }
#demo ul li a:hover {

  }
/* End Demo Style */

JavaScript

src="https://gist.githubusercontent.com/agusmakmun/d96fc8cc3bcc847adfc4/raw/bbe4e2bd0682aa211352728044e47d9231866e2c/switcher.js"

src="https://gist.githubusercontent.com/agusmakmun/087c99a692c5d786f9a3/raw/016d4c59910da16a05834091eda593e019daebe0/switcher-min.js"

//darkstyle
if($.cookie("css")) {
    $("link.dark").attr("href",$.cookie("css"));
}
$(document).ready(function() { 
    $("#darkstyle").click(function() { 
        $("link.dark").attr("href",$(this).attr('rel'));
        $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
        return false;
    });
});

//gradientstyle
if($.cookie("css")) {
    $("link.gradient").attr("href",$.cookie("css"));
}
$(document).ready(function() { 
    $("#gradientstyle").click(function() { 
        $("link.gradient").attr("href",$(this).attr('rel'));
        $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
        return false;
    });
});