index.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8" />
    <title>Clockworks</title>
    <link rel="stylesheet" href="styles.css" />
    <link
      href="https://fonts.googleapis.com/css?family=Montserrat:200,400,800&display=swap"
      rel="stylesheet"
    />

    <script>
      function startTime() {
        var today = new Date();
        var h = today.getHours();
        var m = today.getMinutes();
        var s = today.getSeconds();
        m = checkTime(m);
        s = checkTime(s);
        let text = "Your current time is ➭"
        document.getElementById('txt').innerHTML =
       text + h + ":" + m + ":" + s;
        var t = setTimeout(startTime, 500);
      }
      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="txt"></div>
    
    <h1>Clockworks</h1>

    <section id="controls">
      <div class="input-group">
        <label for="minutes-input">Minutes</label>
        <input
          type="number"
          placeholder="0"
          id="minutes-input"
          max="300"
          min="0"
        />
      </div>

      <div class="input-group">
        <label for="seconds-input">Seconds</label>
        <input
          type="number"
          placeholder="0"
          id="seconds-input"
          step="5"
          max="59"
          min="0"
        />
      </div>

      <button type="button" onclick="startTimer();" id="start-button">
        Start
      </button>
      <button type="button" onclick="stopTimer();" id="stop-button" disabled>
        Stop
      </button>
      <button type="button" onclick="pauseTimer();" id="pause-button" disabled>
        Pause
      </button>
    </section>

    <h2><span id="minutes">0</span>: <span id="seconds">00</span></h2>

    <script
      src="https://code.jquery.com/jquery-3.4.1.min.js"
      integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
      crossorigin="anonymous"
    ></script>
    <script src="./script.js"></script>
  </body>
</html>