On Screen Clock
This short php script generates an on screen clock with a green chroma-key background that can be used in OBS…
<html> <head> <title>A clock for OBS Studio</title> <style> html, body { background-color: #0f0; font-family: Arial, Helvetica, sans-serif ; color: #fff; text-shadow: -4px 0 black, 0 4px black, 4px 0 black, 0 -4px black; font-size: 2em; } .center { display: flex; justify-content: center; align-items: center; height: 100%; } </style> <script> function startTime() { const today = new Date(); let h = today.getHours(); let m = today.getMinutes(); let s = today.getSeconds(); m = checkTime(m); s = checkTime(s); document.getElementById('clock').innerHTML = "<h1>" + h + ":" + m + "</h1>"; setTimeout(startTime, 1000); } function checkTime(i) { if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10 return i; } </script> </head> <body onload="startTime()"> <div id="clock" class="center"><h2>hh:mm</h2></div> </body> </html>