To morph SVG we need more than 2 SVG having the same number of point or vertex, don’t delete or add a new node. <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 288 288"> <linearGradient id="PSgrad_0" x1="70.711%" x2="0%" y1="70.711%" y2="0%"> <stop offset="0%" stop-color="rgb(95,54,152)" stop-opacity="1" /> <stop offset="100%" stop-color="rgb(247,109,138)" stop-opacity="1" />