index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Search Song Lyric</title>
  <!-- Google font -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Martian+Mono:wght@100..800&display=swap" rel="stylesheet">

  <!-- css file -->
  <link rel="stylesheet" href="style.css">

</head>

<body>
  <div class="container">
    <div class="box box-bg">
      <h1>Search Lyrics</h1>
      <form id="form">
        <input type="search" id="search" placeholder="Enter artist name or song title">
        <button class="btn">Search</button>
      </form>
    </div>

    <section class="result box" id="result"></section>
  </div>

  <script src="script.js"></script>
</body>

</html>