path element takes a single d attribute... M (Move the Pen) is just one of many path commands. There are 18 of them by my count. UPPERCASE version is the absolute version and the lowercase is the relative version... L draw lines... h 25 means draw 25 to the right... v move vertically... Z “closes” the path... easy way to draw a straight line directly back to the last place... superpower of path is curves! C and c commands. Those are “Bezier Curves”.. two points define the location of two bezier curve handles.. The last is the end of the curve... S is buddies with the C commands.. assumes that the first bezier point is a reflection of the last bezier point
The SVG viewBox defines the aspect ratio of the image. It defines how all the lengths and coordinates used inside the SVG should be scaled to fit the total space available. It defines the origin of the SVG coordinate system, the point where x=0 and y=0.
transform="translate" can transclate by px only, use <use> to translate by em