Paths can also be defined as curves (quadratic and cubic bezier, and elliptical arcs). Probably the most useful is the cubic bezier. This has the initial letter C and has three coordinates as its parameters. A curved path is defined from the current position (either established by a Move command or a previous line or curve command) to the third point defined in the cubic bezier. The first two points define the bezier control points that give the shape of the curve. The positioning of the control points change the shape of the curve under the user's control as can be seen if the circle is clicked.

M mx,my C c1x, c1y c2x, c2y x, y mx, my c1x, c1y c2x, c2y x, y

A real world example is the creation of a duck as shown below. In the top left the duck has been defined by a set of points and the path is a sequence of straight lines between those points (the points are marked by circles):

<path d="M    0  112
L   20  124 L   40  129 L   60  126 L   80  120 L  100  111 L  120  104 L  140  101 L  164  106 
L  170  103 L  173   80 L  178   60 L  185   39 L  200   30 L  220   30 L  240   40 L  260   61 
L  280   69 L  290   68 L  288   77 L  272   85 L  250   85 L  230   85 L  215   88 L  211   95 
L  215  110 L  228  120 L  241  130 L  251  149 L  252  164 L  242  181 L  221  189 L  200  191 
L  180  193 L  160  192 L  140  190 L  120  190 L  100  188 L   80  182 L   61  179 L   42  171 
L   30  159 L   13  140  Z"/>

The duck without point markers is shown in the top right. In the bottom left the duck has been defined by a set of cubic bezier curves (the control points are marked by aqua circles and the end points by yellow circles) and the duck without the point markers is shown bottom right. The duck defined by bezier curves is:

<path  d="M  0  312
C  40  360  120  280  160  306  C 160  306  165  310  170  303
C 180  200  220  220  260  261  C 260  261  280  273  290  268
C 288  280  272  285  250  285  C 195  283  210  310  230  320
C 260  340  265  385  200  391  C 150  395   30  395   0   312 Z"/>

The number of points in the path defined by lines is 43 while the bezier definition uses 25. The path could also be defined using relative coordinates and commas as separators in which case it would be:

<path  d="M  0  312c40,48,120,-32,160,-6c0,0,5,4,10,-3c10,-103,50,-83,90,-42 
c0,0,20,12,30,7c-2,12,-18,17,-40,17c-55,-2,-40,25,-20,35c30,20,35,65,-30,71
c-50,4,-170,4,-200,-79 z"/>

Note that it does not really make any difference whether you complete the closed curve with upper or lowercase Z as the effect is identical. Removing unnecessary spaces reduces the path definition to 160 characters compared with the 443 characters in the initial line path representation:

<path d="M 0 312c40 48 120-32 160-6c0 0 5 4 10-3c10-103 50-83 90-42c0 0 20 12 30 7c-2 12-18 17-40 17
            c-55-2-40 25-20 35c30 20 35 65-30 71c-50 4-170 4-200-79 z"/>