SVG is Scalable Vector Graphics. It is HTML & CSS code that draws animations, arcs, colors, lines, shadows, shapes, text, etc.

It is an image specification that renders any image with the same clarity, irrespective of the viewport size.

Flutter has the CustomPaint widget. With CustomPaint, you specify how painting should be done in every detail as if on a canvas.

Turns out that CustomPaint's APIs and methods closely resemble the SVG Image Spec.

Just as with SVG, you can specify animations, arcs, colors, lines, shadows, shapes, text, etc. all in CustomPaint. There are options you don't get with the basic Container widget.

In this session, the audience will learn more about both CustomPaint and SVG. They will learn these complex UI tools from the angle of their features.

We will show a side-by-side comparison of achieving the same complex UIs with both tools.