Blob Generator

					
<style>
  .float {  
    animation-name: ani-float;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out; 
  }
 
  @keyframes ani-float {
    0% { transform: translate(0,  0px); }
    50% { transform: translate(0, 15px); }
    100% { transform: translate(0, -0px); }    
  }
</style>

<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" 
  viewBox="-25 -25 250 250" class="float"> 
  <defs>
   <linearGradient id="lgrad" x1="0%" y1="50%" x2="100%" y2="50%" >
     <stop offset="0%" style="stop-color:#00FF84;stop-opacity:1.00" />
     <stop offset="100%" style="stop-color:#008EE6;stop-opacity:1.00" />
   </linearGradient>
  </defs>
  <path d="M176.9542393266461 36.14042711028146 C140.32451581848872 9.95043265625678 22.117546119007876 39.12998889369251 2.128118870997369 79.47940341339027 C-10.66962077069201 105.3121246470158 21.98287032903039 172.64476522600594 47.8680152180528 185.33613632392098 C80.06138893477683 201.12040388295952 166.05090337113208 178.93540006637156 186.7845066485759 149.68349228630456 C203.26049316248614 126.43842332065832 200.13133934110374 52.71189046582221 176.9542393266461 36.14042711028146Z" stroke="none" fill="url(#lgrad)"  />
</svg>
Blob Generator

resources
