FrontEnd.ro logo
Cum să animezi un Blob?
<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" id="blobSvg">
  <path 
    fill="#282935"
    d="M419,309.5Q435,369,389.5,412.5Q344,456,279.5,475Q215,494,166,449Q117,404,106,350Q95,296,61.5,240.5Q28,185,81,150.5Q134,116,176.5,75Q219,34,270,64Q321,94,382,110Q443,126,423,188Q403,250,419,309.5Z"
  >
    <animate 
      dur="3s"
      attributeName="d" 
      repeatCount="indefinite"
      values="
        M419,309.5Q435,369,389.5,412.5Q344,456,279.5,475Q215,494,166,449Q117,404,106,350Q95,296,61.5,240.5Q28,185,81,150.5Q134,116,176.5,75Q219,34,270,64Q321,94,382,110Q443,126,423,188Q403,250,419,309.5Z;
        M426.5,305Q421,360,382,406.5Q343,453,282,452.5Q221,452,156.5,442Q92,432,78,368Q64,304,51,246Q38,188,82.5,148Q127,108,172,62.5Q217,17,285,20.5Q353,24,393.5,78Q434,132,433,191Q432,250,426.5,305Z;
        M419,309.5Q435,369,389.5,412.5Q344,456,279.5,475Q215,494,166,449Q117,404,106,350Q95,296,61.5,240.5Q28,185,81,150.5Q134,116,176.5,75Q219,34,270,64Q321,94,382,110Q443,126,423,188Q403,250,419,309.5Z;
      " 
    />
  </path>
</svg>