Как добавить анимацию к свг ?

svg text { 
  font-family: sans-serif; 
  text-anchor: middle; 
  font-weight: bold; 
  font-size: 70px; 
  fill: url(#fendTestGrad); 
} 
 
#fendTestGrad .start { 
  stop-color: #c2c5cc; 
} 
#fendTestGrad .end { 
  stop-color: #8f98a1; 
} 
 
svg { 
background: linear-gradient(135deg, rgba(73,85,97,1) 0%, rgba(74,88,101,1) 100%); 
}

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewbox="0 0 100 100"> 
  <defs> 
    <linearGradient id="fendTestGrad" x1="52%" y1="52%" x2="48%" y2="48%"> 
        <animate  
          attributeName="x1"  
          from="0" to=".52"          
          dur="3s"  
          repeatCount="1">           
        </animate> 
        <animate  
          attributeName="y1"  
          from="0" to=".52"          
          dur="3s"  
          repeatCount="1">           
        </animate> 
        <animate  
          attributeName="x2"  
          from="0" to=".48"          
          dur="3s"  
          repeatCount="1">           
        </animate> 
        <animate  
          attributeName="y2"  
          from="0" to=".48"          
          dur="3s"  
          repeatCount="1">           
        </animate> 
       
      <stop class="start"></stop> 
      <stop class="start"></stop> 
      <stop class="end"></stop> 
    </linearGradient> 
  </defs> 
  <text x="50%" y="70">60</text> 
</svg>