Click to add more spline nodes. Backspace key deletes them. You can drag nodes around.
The red spline is an x-spline, as defined by Blanc & Schlick (1995). At each node of the x-spline, you can move the slider to alternate between approximating, sharply interpolating or smoothly interpolating at that node. There are also buttons to make the entire x-spline approximating, sharp, or interpolating.
The blue spline is the standard SVG splines, as made available by D3.js. You can change the SVG spline type from the drop-down menu. The approximating x-spline is very close to the basis spline and the interpolating x-spline is very close to the cardinal spline, with the added benefit that the x-spline gives a continuum of approximation between basis and cardinal splines.
Here you can see my slides for a talk I gave on this subject at Papers We Love in Montréal.
You can contact me at jordigh@octave.org.