CodePen Embed - SVG

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="300" version="1.1" xmlns="http://www.w3.org/2000/svg">
<text x="10" y="10">Change color with motion</text>
<rect id="myRect" x="10" y="30" width="200" height="100" style="fill:#CCCCFF; stroke:#000099">
  <animate attributeName="fill" from="blue" to="red" dur="4s" fill="freeze"/>
  <animateMotion dur="6s" path="M10 10 L 400 30" rotate="auto"> 
</rect>
</svg>

This Pen is owned by raphiki on CodePen.

See more by @raphiki on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.