<svg width="250" height="250"> <!-- show the path along which the triangle will move --> <path d="M50,125 C 100,25 150,225, 200, 125" style="fill: none; stroke: blue;"/> <!-- Triangle to be moved along the motion path. It is defined with an upright orientation with the base of the triangle centered horizontally just above the origin. --> <path d="M-10,-3 L10,-3 L0,-25z" style="fill: yellow; stroke: red;" > <animateMotion path="M50,125 C 100,25 150,225, 200, 125" rotate="auto" dur="6s" fill="freeze"/> </path> </svg>