JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://stevenlevithan.com/assets/misc/date.format.js"></script>
<div><strong>Fraction of time:</strong></div>
<input id='fraction' type="text" value="12.5" /> (hit enter to update)

<div id="result"></div>

CSS

* {
    font-size: 1em;
}
strong {
    font-weight: bold;
}
div {
    margin: 10px 0;
}

JavaScript

$('#fraction').keyup(update);

function update(event) {
    if(event.keyCode != 13 /* enter */) {
        return;
    }

    $("#result").text(formatTime(this.value));
}
    
function formatTime(fraction) {
    var seconds = fraction * 3600;
    var date = new Date(2000, 1, 1);
    date.setUTCSeconds(seconds);

    return date.format("HH:MM:ss");
}