SVG mit JavaScript und Snap.svg generiert.

<!DOCTYPE html>
<html>

  <head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.4.1/snap.svg.js"></script>
  </head>

  <body>
    <h1>Hallo SVG!</h1>
    <svg width="200" height="200" viewBox="0 0 74 74" id="svg"></svg>
    <p>
      Die gesamte SVG-&Uuml;bung findest du auf der 
      <a href="http://coderdojo-linz.github.io/trainingsanleitungen/web/erste-schritte-mit-svg.html">CoderDojo Linz</a>
      Seite.
    </p>

    <script src="script.js"></script>
  </body>

</html>

var s = Snap("#svg");

s.circle(37, 37, 37).attr("fill", "#F0CA00");
s.circle(37, 37, 35).attr("fill", "#008754");
s.circle(37, 37, 25).attr("fill", "#F0CA00");
s.path("m 44.5,34 -15,0 0,-16 -6,0 0,38 6,0 0,-17 15,0 0,17 6,0 0,-38 -6,0 z")
  .attr("fill", "#008754");