Сохраните и внедрите эти CSS loaders 🚀 / Frontend разработчик / Telegram Center

Сохраните и внедрите эти CSS loaders 🚀

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

<head>
    <meta charset="UTF-8">
    <title>Loaders</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <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=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div class="container">
        <div class="top-bar">
            <div class="profile-wrapper">
                <img
                  class="profile"
                  src="assets/profile_new.jpg"
                  alt="profile picture"
                />
                <p>@davidm_ai</p>
            </div>
        </div>
       
        <h1>CSS <span class="emph">Loaders</span></h1>
        <div class="loaders">
            <div class="loader-wrapper">
                <div>1</div>
                <div class="loader-1"></div>    
            </div>
            <div class="loader-wrapper">
                <div>2</div>
                <div class="loader-2"></div>
            </div>
            <div class="loader-wrapper">
                <div>3</div>
                <div class="loader-3"></div>
            </div>
            <div class="loader-wrapper">
                <div>4</div>
                <div class="loader-4"></div>
            </div>
            <div class="loader-wrapper">
                <div>5</div>
                <div class="loader-5"></div>
            </div>
            <div class="loader-wrapper">
                <div>6</div>
                <div class="cube-wrapper">
                    <div class="cube">
                        <div class="sides">
                          <div class="top"></div>
                          <div class="right"></div>
                          <div class="bottom"></div>
                          <div class="left"></div>
                          <div class="front"></div>
                          <div class="back"></div>
                        </div>
                      </div>
                </div>
            </div>
        </div>
        <p class="code-comments">
            Code In The Comments 👨‍💻
        </p>
        <p class="bottom-bar">
            <span class="modern-frontend-developer">
                <span class="emph">Modern Frontend Developer</span>: <span class="emph">HTML</span> and <span class="emph">CSS</span> (55% off)
            </span>
            <span class="learning-link">
                <img src="assets/atheros-learning.png" alt="arrow icon" />
                learning.atheros.ai
            </span>
        </p>
        
    </div>

  
</body>

</html>

https://github.com/atherosai/ui/blob/main/loaders-01/index.html 👉 @frontend_1

https://t.center/frontend_1/3869

1.4K viewsDec 28 at 08:35

Love Center - Dating, Friends & Matches, NY, LA, Dubai, Global

Find friends or serious relationships easily