Skip to content

Instantly share code, notes, and snippets.

@kirinelf

kirinelf/clock.html

Forked from sam0737/clock.html
Last active September 3, 2025 16:08
Show Gist options
  • Save kirinelf/932d7704e623fd42970801597ddcccc4 to your computer and use it in GitHub Desktop.
Save kirinelf/932d7704e623fd42970801597ddcccc4 to your computer and use it in GitHub Desktop.
Download ZIP
OBS Studio: A HTML page for showing current date and time in the video
Raw
clock.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>A simple clock</title>
</head>
<body translate="no" >
<div id="output"
style= "display: inline-block;
font-family: monospace;
font-size: 30px;
text-align: right;
color: lightgray;
border-radius: 10px;
padding: 10px;
background-color: rgba(0, 0, 0, 0.75);">
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js'></script>
<script>
// https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript
var urlParams;
(function () {
var match,
pl = /\+/g, // Regex for replacing addition symbol with a space
search = /([^&=]+)=?([^&]*)/g,
decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
query = window.location.search.substring(1);
urlParams = {};
while (match = search.exec(query))
urlParams[decode(match[1])] = decode(match[2]);
})();
var output = document.getElementById("output");
if (urlParams["style"]) output.setAttribute("style", urlParams["style"]);
if (urlParams["bodyStyle"]) document.body.setAttribute("style", urlParams["bodyStyle"]);
var c;
setInterval(
c = function() {
output.innerText = moment().format(urlParams["format"] || 'DD/MM/YYYY HH:mm:ss');
// output.innerText = moment().format(urlParams["format"] || '');
}, 1000);
c();
</script>
</body>
</html>
@chessset5
Copy link

chessset5 commented Sep 2, 2025 •
edited
Loading

I made an adjustment to include the analog clock you can toggle based on this code. Am I allowed to post it online under certain condition? or should I just use it myself?

@bgh1234554, No one is stopping you, all anyone asks is that you format your comment correctly.

Use three ticks (`) (top left of a US layout keyboard) on top and bottom of your code to format the code.
One tick for one line code snippets.

|```html
| // code here and the (and the bars/pipes I used as an escape)
|```

`#one liner`

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment