Examples

Typst, compiled as these pages build.

Worked examples of the typst-render extension: maths, figures, cross-references, brand colours, data from R and Python, files, and slides.

Every figure in this section is compiled by the Typst binary Quarto ships, as the page is rendered. The site asks for SVG, so the figures stay sharp at any zoom:

extensions:
  typst-render:
    format: svg

The pages

What each page of this section shows.
Page	What it covers
Maths	The `math: typst` takeover, Typst maths syntax, and equations that reach every format.
Figures and tables	Size, output format, resolution, alignment, and showing the source.
Cross-references	`label`, `cap`, and `alt`, for figures, tables, and any other reference type.
Brand and theming	Reading `_brand.yml` inside a block, and one figure for the light and the dark side of a page.
Data from R and Python	`typst_define()`, and reading computed values inside a block.
Output and files	Preambles, external `.typ` files, multi-page output, input variables, and the cache.
Presentations	The Reveal.js options: placement, line stepping, and sizing to the slide.

Inline expressions

An inline expression scales to the text around it, so a red word #text(red)[hello] sits in a sentence, and so does a formula $ x^2 + y^2 = z^2 $ .

Attributes carry the alt text and the compilation options of one expression:

The area is `{typst} $pi r^2$`{alt="pi r squared" format="png" dpi="300"}.

The Reference lists every attribute an expression accepts, and the block options it ignores.

Source

The repository ships a short, standalone starting point you can copy: example.qmd.

Every release attaches example-render.tar.gz, that same file rendered to HTML, Typst, PDF through each of the three LaTeX engines, RevealJS, Beamer, Word, and PowerPoint. It is on the latest release, and is the way to see one source come out as figures in nine outputs.