Working with SVG

A small guide to the vector format used by the Typvs studies.

SVG is a text format for vector graphics. It gives a drawing a coordinate system and describes its paths in markup. Browsers can display the result directly, and the path commands remain inspectable.

An SVG path

This compact example draws a simple geometric outline. It is a general SVG example, not output from a Typvs endpoint.

<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
  <path d="M20 100 V20 H70 Q100 20 100 60 Q100 100 70 100 Z"
        fill="none" stroke="currentColor" />
</svg>

Read the geometry

The viewBox defines the drawing space. The path carries commands such as move (M), line (V), curve (Q), and close (Z). The fill and stroke attributes control how it appears.

Use with Typvs

The Typvs studies display SVG contours and related marks. Compare the visible output with the contour guide to see the geometry behind the drawing.