Animate color of a SVG rectangle

A simple example of animating color of a SVG rectangle. 
<!DOCTYPE HTML>
<html>
  <head>
    <style>
      body {
        margin: 0px;
        padding: 0px;
      }
    </style>
  </head>
  <body>

    <svg height="500" width="500">
      <rect id="rec" x="100" y="100" width="100" height="100" style="fill:lime"> 
         <animate attributeName="fill" attributeType="CSS" begin="0s" dur="3s" fill="freeze" from="lime" to="red" /> 
      </rect>
    </svg>

  </body>
</html>
List

Responses

0 Replies