index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Image Fetcher</title>
    <link rel="stylesheet" href="main.css">
</head> 
<body>
    <div id="background">
        <h1><span>I</span><span>M</span><span>A</span><span>G</span><span>E</span> FETCHER</h1>
        <form id="search-form">    
            <input type="text" placeholder="Search for images" id="search-input">
            <button id="search-button"  style="--clr:#fff"><span>Search</span><i></i></button>
        </form>
    </div>
    <!-- <div class="toggle">
            <i class="indicator"></i>
    </div> -->
    
    <div id="search-result" onclick="audio1.play()">
    </div>
    <div class="container">
        <div class="btn">
            <button id="show-more-button" class="btn">Show More</button>
        </div>
    </div>
    <script src="main.js"></script>
    <script type="text/javascript">
        const audio1 = new Audio();
        audio1.src = "./click.mp3";
    </script>
</body>
</html>
<!-- onclick="audio1.play()" -->