google ui/index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
    <link
        href="https://fonts.googleapis.com/css2?family=Fredoka+One&family=Pacifico&family=Playfair+Display&family=Roboto+Slab:wght@300&family=Work+Sans:wght@300;400&display=swap"
        rel="stylesheet">
</head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

<body>
    <nav>
        <a href="" class="toplink">Gmail</a>
        <a href="" class="toplink">Image</a>
        <img class="apps" src="https://github.com/codingWithElias/google-ui/blob/master/img/g-menu.PNG?raw=true" alt=""
            srcset="">
        <button type="button" class="btn btn-primary mx-3">Sign in</button>
    </nav>

    <div id="middle">
        <div class="letters">
            <span style="color:#0077ff">G</span>
            <span style="color:#ee0d0d">o</span>
            <span style="color:#fffb00">o</span>
            <span style="color:#0077ff">g</span>
            <span style="color:#00ff40">l</span>
            <span style="color:#ee0d0d">e</span>
        </div>
        <div id="searchBarContainer">
            <img class="im"
                src="https://raw.githubusercontent.com/codingWithElias/google-ui/68a8e32475fd9184d0a966dde920d5e96711ec51/img/search.svg"
                alt="" srcset="">

            <input type="text" placeholder="        Search Google or type a URL" id="searchBar">
            <img class="ig" src="https://github.com/codingWithElias/google-ui/blob/master/img/vs.png?raw=true" alt="">
        </div>
        <div id="buttons">
            <div class="button">
                Google Search
            </div>
            <div class="button">
                I'm Feeling Lucky
            </div>
        </div>
        <div id="links">
            Google is offered in : <a href="">हिन्दी </a>
            <a href="">বাংলা </a>
            <a href="">తెలుగు </a>
            <a href="">मराठी </a>
            <a href=""> தமிழ் </a>
            <a href="">ગુજરાતી </a>
            <a href="">ಕನ್ನಡ </a>
            <a href="">മലയാളം </a>
            <a href="">ਪੰਜਾਬੀ
            </a>
        </div>
    </div>

    <div id="footer">
        <div id="footer-content-1">
            <a href="">About</a>
            <a href="">Advertising</a>
            <a href="">Bussiness</a>
            <a href="">How Search works</a>
        </div>
        <div id="footer-content-2">
            <a href="">Privacy</a>
            <a href="">Terms</a>
            <a href="">Setting</a>
        </div>
    </div>
</body>

</html>