exercises/23-speech-synthesis/index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <link rel="stylesheet" href="../../global//reset.css" />

    <link rel="stylesheet" href="../../global/style.css" />

    <link rel="stylesheet" href="css/style.css" />

    <title>Speech Synthesis</title>

    <link rel="shortcut icon" href="images/icon.svg" type="image/x-icon" />

    <link
      href="https://fonts.googleapis.com/css?family=Pacifico"
      rel="stylesheet"
      type="text/css"
    />
  </head>
  <body>
    <a class="back-home" href="../../index.html">Back to Home</a>

    <div class="wrapper">
      <div class="voiceinator">
        <h1>The Voiceinator 5000</h1>

        <select name="voice" id="voices">
          <option value="">Select A Voice</option>
        </select>

        <label for="rate">Rate:</label>
        <input name="rate" type="range" min="0" max="3" value="1" step="0.1" />

        <label for="pitch">Pitch:</label>

        <input name="pitch" type="range" min="0" max="2" step="0.1" />
        <textarea name="text">Hello! I love JavaScript 👍</textarea>
        <button id="stop">Stop!</button>
        <button id="speak">Speak</button>
      </div>
    </div>

    <script src="js/script.js"></script>
  </body>
</html>