<svg width="200" height="200" viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
  <ellipse id="myEllipse" cx="50%" cy="50%" rx="0" ry="0">
    <animate attributeName="rx" values="0;40%;0" dur="3s" repeatCount="indefinite" />
  </ellipse>
  <animate href="#myEllipse" attributeName="ry" values="0;20%;0" dur="6s" repeatCount="indefinite" />
</svg>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.