JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header left font13" id="setup">Settings</div>
<div class="header mid font13" id="wtime"></div>

CSS

* {
  -webkit-appearance: none;
  user-select: none;
}

body {
  background: #046;
  color: #fff;
  white-space: nowrap;
  text-align: center;
  margin: 0;
  padding: 0;
}

.header {
  position: absolute;
  top: 5pt;
}

.left {
  left: 10pt;
}

.mid {
  left: 0;
  right: 0;
}

.font13 {
  font-size: 13pt;
}

.blink {
  animation: blink 1s step-start infinite;
}

JavaScript

document.getElementById("setup").addEventListener("click", function() {
  console.log("Settings!");
});

setInterval(function() {
  console.log("Alive!");
  document.getElementById("wtime").innerHTML = "11:45".replaceAll(":", "<span class='blink'>:</span>");
}, 5000);