<!-- <div class="w-12 h-12 border-4 border-green-400 rounded-full outer-loader">
  <div class="mt-1 ml-1 w-8 h-8 border-4 border-green-400 rounded-full middle-loader">
    <div class="mt-1 mx-auto w-4 h-4 border-4 border-green-400 rounded-full inner-loader"></div>
  </div>
</div>


<div class="w-12 h-12 border-4 border-green-400 rounded-full outer-loader">
  <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#34D399" class="hash-spinner mt-1 ml-1" viewBox="0 0 16 16">
    <path d="M8.39 12.648a1.32 1.32 0 0 0-.015.18c0 .305.21.508.5.508.266 0 .492-.172.555-.477l.554-2.703h1.204c.421 0 .617-.234.617-.547 0-.312-.188-.53-.617-.53h-.985l.516-2.524h1.265c.43 0 .618-.227.618-.547 0-.313-.188-.524-.618-.524h-1.046l.476-2.304a1.06 1.06 0 0 0 .016-.164.51.51 0 0 0-.516-.516.54.54 0 0 0-.539.43l-.523 2.554H7.617l.477-2.304c.008-.04.015-.118.015-.164a.512.512 0 0 0-.523-.516.539.539 0 0 0-.531.43L6.53 5.484H5.414c-.43 0-.617.22-.617.532 0 .312.187.539.617.539h.906l-.515 2.523H4.609c-.421 0-.609.219-.609.531 0 .313.188.547.61.547h.976l-.516 2.492c-.008.04-.015.125-.015.18 0 .305.21.508.5.508.265 0 .492-.172.554-.477l.555-2.703h2.242l-.515 2.492zm-1-6.109h2.266l-.515 2.563H6.859l.532-2.563z"/>
  </svg>
</div> -->

<div class="animate-spin inline-block">
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" fill="#34D399" viewBox="0 0 16 16">
    <path d="M8.39 12.648a1.32 1.32 0 0 0-.015.18c0 .305.21.508.5.508.266 0 .492-.172.555-.477l.554-2.703h1.204c.421 0 .617-.234.617-.547 0-.312-.188-.53-.617-.53h-.985l.516-2.524h1.265c.43 0 .618-.227.618-.547 0-.313-.188-.524-.618-.524h-1.046l.476-2.304a1.06 1.06 0 0 0 .016-.164.51.51 0 0 0-.516-.516.54.54 0 0 0-.539.43l-.523 2.554H7.617l.477-2.304c.008-.04.015-.118.015-.164a.512.512 0 0 0-.523-.516.539.539 0 0 0-.531.43L6.53 5.484H5.414c-.43 0-.617.22-.617.532 0 .312.187.539.617.539h.906l-.515 2.523H4.609c-.421 0-.609.219-.609.531 0 .313.188.547.61.547h.976l-.516 2.492c-.008.04-.015.125-.015.18 0 .305.21.508.5.508.265 0 .492-.172.554-.477l.555-2.703h2.242l-.515 2.492zm-1-6.109h2.266l-.515 2.563H6.859l.532-2.563z"/>
</svg>
</div>
<!-- <div class="animate-spin">HELLO</div> -->


<style>
  @keyframes loader-rotate {
    0% {
      transform: rotate(0);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  .outer-loader {
    border-left-color: transparent;
    animation: loader-rotate 2s linear infinite;  
  }
  .middle-loader {
    border-right-color: transparent;
      animation: loader-rotate 3s linear infinite; 
  }
  .inner-loader {
    border-left-color: transparent;
    animation: loader-rotate 4s linear infinite;  
  }
  .hash-spinner {
  animation: loader-rotate 4s linear infinite; 
  }
</style>