SVG Smil Morphing

<!doctype html>
<title>Example</title>
<svg width="200" height="400" viewBox="0 0 100 200">
  
  
  <path d="M 50 20 L 80 20 L 80 50 L 80 80 L 50 80 L 20 80 L 20 50 L 20 20 Z" fill="gold" stroke="orange" stroke-width="2">
    <animate 
      attributeName="d" 
      values="M 50 20 L 80 20 L 80 50 L 80 80 L 50 80 L 20 80 L 20 50 L 20 20 Z; 
              M 50 10 L 65 35 L 90 50 L 65 65 L 50 90 L 35 65 L 10 50 L 35 35 Z; 
              M 50 20 L 80 20 L 80 50 L 80 80 L 50 80 L 20 80 L 20 50 L 20 20 Z" 
      dur="3s" 
      repeatCount="indefinite" />
  </path>
  <text x="50" y="110" font-size="6" text-anchor="middle" font-family="sans-serif">Square to Star Morph</text>

<path d="M 20 150 Q 50 130, 80 150 Q 50 170, 20 150" fill="white" stroke="black">
    <animate 
      attributeName="d" 
      values="M 20 150 Q 50 130, 80 150 Q 50 170, 20 150;
              M 20 150 Q 50 150, 80 150 Q 50 150, 20 150;
              M 20 150 Q 50 130, 80 150 Q 50 170, 20 150" 
      dur="2s" 
      repeatCount="indefinite" />
  </path>
  <text x="50" y="185" font-size="6" text-anchor="middle" font-family="sans-serif">Blinking Eye (Path Morph)</text>
</svg>