SVG Tipps und Tricks

<?xml version="1.0"?>
<svg  width="125" height="125" viewbox="0 0 125 125" version="1.0" xmlns="http://www.w3.org/2000/svg">
  <g fill="none" stroke="black" stroke-width="3">
 <circle cx="60" cy="60" r="50" />
 <path d="M 60 60 A 25 25 1 0 1 60 10" />
 <path d="M 60 60 A 25 25 1 0 1 60 110" />
 </g>
</svg>

<?xml version="1.0"?>
<svg  width="125" height="125" viewbox="0 0 125 125" version="1.0" xmlns="http://www.w3.org/2000/svg">
<defs>
<marker id="pfeil" markerWidth="10" markerHeight="7" refX="0" refY="3.5" orient="auto">
<polygon points="0 0, 10 3.5, 0 7" />
</marker>
<pattern id="karos" viewBox="0 0 10 10" patternUnits="userSpaceOnUse" preserveAspectRatio="none" patternContentUnits="objectBoundingBox" width="10" height="10">
<line x1="0" y1="5" x2="10" y2="5" stroke="lightgrey" stroke-width=".2" />
<line x1="5" y1="0" x2="5" y2="10" stroke="lightgrey" stroke-width=".2" />
</pattern>
</defs>
<rect width="500" height="300" fill="url(#karos)" />
</svg>