Typst Render

Typst figures, in every output format.

What the typst-render extension is for, how to enable it, and the smallest Typst block that becomes a figure.
Author

Mickaël CANOUIL, Ph.D.

Typst draws diagrams, tables, and equations well, and Quarto can render to Typst. The moment the same document also has to produce HTML, a PDF through LaTeX, or a Word file, none of that Typst is available.

typst-render compiles the Typst instead of passing it through. A {typst} block becomes an image, built by the Typst binary Quarto already ships, so the figure survives into every format.

Installation

quarto add mcanouil/quarto-typst-render@0.21.0

This will install the extension under the _extensions subdirectory. If you are using version control, you will want to check in this directory.

Or install it from your editor with Quarto Wizard:

Visual Studio Code Positron VSCodium

Important

Reference the filter by name, without an at: stage. It registers itself at the several stages it needs, and pinning it to one breaks cross-referencing and the math: typst takeover.

Quick start

filters:
  - typst-render

Then write Typst:

```{typst}
#circle(radius: 1cm, fill: blue)
```

Which compiles to this, as the page is built:

#circle(radius: 1cm, fill: blue)

Inline expressions work too, and scale to the surrounding text:

A red word `{typst} #text(red)[hello]` in the middle of a sentence.

A red word #text(red)[hello] in the middle of a sentence.

See the Reference for every option, and the Examples for figures, tables, equations, and the options that shape them.

Where it works

Every output format. The Typst is compiled to an image, so HTML, PDF, Word, PowerPoint, and slides all receive the same figure.

Under Typst output the image is produced too, unless you ask for output: asis, which passes the code through natively instead.

Back to top