Loader with logo

 avatar
unknown
plain_text
2 years ago
1.6 kB
6
Indexable
<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=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script> 
<style>
  *{
    font-family: 'Inter', sans-serif;
  }
   html, body  {
        height: 100%;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: center;
      }
    .childDiv{
        display: flex;
       align-items: center; 
       justify-content: space-between;
    }
    .footer{
        position: absolute;
        left: 0;
    }
    .exploreBtn{
        border: none;
        background-color: #F75B24;
        padding: 1rem 2rem;
        color: white;
        border-radius: 10px;
        font-weight: 700 !important;
    }
    .exploreBtn:hover{
        background-color: #d54f1f;
    }
    .font-style{
      font-size: 40px;
      font-weight: bold !important;
    }
</style>
  <body style="background-color: white;">
            <div class="childDiv" style="display: flex;flex-direction: column;">
                  <lottie-player src="https://lottie.host/26a6468c-0598-4d71-b7a6-076ad3e36b6c/jBeEsTL7MM.json" background="transparent" speed="1" style="width: 200px; height: 200px; margin: 0;" loop autoplay></lottie-player>
                    <p class="font-style" style="max-width: 500px;margin-top: 2rem;">Loading..</p>
    </div>
</body>
</html>

Editor is loading...