HTML/CSS - Confetti.web Online Editor and JavaScript Compiler

html

 <button id="confetti-btn" type="button">Confetti <i class="fas fa-play"></i><i class="fas fa-pause"></i></button>
<!-- https://github.com/g1f1 -->
<div class="github">
  <a class="btn btn-link" href="https://github.com/g1f1/g1f1" title="Find more info on GitHub">
    <img class="img-fluid" id="gh-mark" src="https://github.com/g1f1/g1f1/readme.assets/ego.png" alt="">
    <span id="gh-project">Made with ❤️</span>
  </a>
  <div style="text-align: center">
    <a class="github-button" href="https://github.com/g1f1/g1f1" data-icon="octicon-star" data-show-count="true" aria-label="Star g1f1/g1f1 on GitHub">Star</a>
    <a class="github-button" href="https://github.com/g1f1/g1f1/fork" data-icon="octicon-repo-forked" data-show-count="true" aria-label="Fork g1f1/g1f1 on GitHub">Fork</a>
  </div>
</div>
<script async="" defer="" src="https://buttons.github.io/buttons.js"></script>

css

button {
  font-size: 30px;
  background:  rgb(0, 0, 0);
  color:  #fff;
  border: 0;
  border-radius: 4px 6px;
  margin: 10px;
  padding: 3px 10px;
}
body {
  background:  #232323;
}
.hidden {
  display: none;
}
.github {
  bottom: 10px;
  right: 10px;
  position: fixed;
  border-radius: 10px;
  background:  #fff;
  padding: 0 12px 6px 12px;
  border: 1px solid  #000;
}

window.onload = function() {
const btnConfetti = document.getElementById("confetti-btn");
let status = true;
let particlesContainer;
let particlesOptions;
btnConfetti.addEventListener("click", function () {
  toggleStatus(!status);
});
function toggleStatus(newStatus) {
  status = newStatus;
  if (status) {
    tsParticles.load(particlesOptions).then((container) => {
      particlesContainer = container;
      document.querySelector(".fa-play").classList.add("hidden");
      document.querySelector(".fa-pause").classList.remove("hidden");
    });
  } else {
    if (particlesContainer) {
      particlesContainer.destroy();
      particlesContainer = undefined;
      document.querySelector(".fa-play").classList.remove("hidden");
      document.querySelector(".fa-pause").classList.add("hidden");

BROWSER

Console