SVG: definire curve e forme libere

    <svg stroke="black" fill="none">
    <path d="M50,35 L140,35 C190,35 190,115 140,115 L50,115" />
</svg>   
    <svg stroke="black" fill="none">
    <path d="M50,35 L140,35 C190,35 190,115 140,115 L50,115" />
</svg>
  

  d="M50,35 L140,35 C190,35 190,115 140,115 L50,115"

Imposta le seguenti istruzioni di disegno del tracciato:

• M50,35: sposta il punto di inizio alle coordinate 50, 35
• L140,35: disegna una linea fino alle coordinate 140, 35
• C190,35 190,115 140,115: disegna una curva con i punti di controllo alle coordinate 190, 35 e 190, 115 e che finisce alla posizione 140, 115
• L50,115: disegna una linea fino alle coordinate 50, 115

L’elenco completo delle istruzioni si può trovare anche su SVG <path> sul sito di W3School.

Modificare una o più coordinate o aggiungere altre istruzioni per concludere il tracciato.

• An Interactive Guide to SVG Paths
• Understanding SVG Paths