Free Typst Previewer
Write or open a Typst document to see its compiled pages, outline its structure, and find what stops it from compiling.
What is a Typst Previewer?
Typst is a typesetting system for papers, reports and letters, started in 2019 by Laurenz Mädje and Martin Haug as a faster, friendlier alternative to LaTeX. Its compiler was open-sourced in 2023. This previewer runs that compiler in your browser and shows the pages as you type.
It compiles with typst.ts, a WebAssembly build of the official compiler, using Typst’s default fonts served from this site. Errors and warnings come back with their line and column, explained in plain words. An outline lists headings, labels, functions and rules, and a check finds the files, packages and references a single-file preview can’t resolve.
Key Features
Real Compiler
The official Typst compiler, built for the browser, so output matches the Typst CLI.
Readable Errors
Unknown names, open brackets and missing labels, with line and column.
Document Outline
Headings with their labels, functions, set and show rules, maths and code blocks.
Single-File Check
Included files, images, bibliographies and packages listed before you compile.
Fonts Included
Libertinus Serif, New Computer Modern Math and DejaVu Sans Mono, Typst’s defaults.
Perfect for everyone
- Students
- Researchers
- Technical writers and anyone moving from LaTeX to Typst
How to Use the Typst Previewer
Write a document, paste one from the Typst web app, or open a .typ file. The preview compiles as you type, and the outline and check work even before the compiler has finished loading.
Write or Open
Type Typst markup or open a .typ file from your computer.
Read the Pages
The compiled pages appear on the right, with any errors above them.
Outline It
See headings, labels and rules to check a long document’s structure.
Check It
Find files, packages and references the preview can’t resolve on its own.
Typst Documents, Outlined and Checked
Each row is a Typst document of the kind people write: reports, letters, thesis chapters and books. Each answer is this tool’s outline or check, read from the markup without compiling, so the same output appears before the compiler has loaded.
“#set page(paper: "a5", margin: 1.5cm) #set heading(numbering: "1.") #set text(size: 10pt) = Load test results <results> The API held *2,000 requests per second* for an hour. See @latency for the tail. == Latency <latency> $ p_99 = 182 "ms", quad overline(x) = 41 "ms" $ #table( columns: 3, [*Endpoint*], [*p50*], [*p99*], [/search], [38 ms], [182 ms], [/orders], [44 ms], [167 ms], ) == Next steps + Cache search results for _30 seconds_ + Re-run with $n = 5000$ users ```sh k6 run --vus 5000 load.js ``` ”
“#import "@preview/cetz:0.3.4": canvas, draw #let signature(name) = block(above: 2em)[#name \ _Head of Operations_] #show link: underline Dear Ms. Patel, Thank you for visiting on #datetime(year: 2026, month: 10, day: 12).display("[day] [month repr:long]"). The figures are in @appendix, and the full report is at #link("https://example.com/report"). #signature("Ravi Shah") ”
“#set page(paper: "a5", margin: 1.5cm) #set heading(numbering: "1.") #set text(size: 10pt) = Load test results <results> The API held *2,000 requests per second* for an hour. See @latency for the tail. == Latency <latency> $ p_99 = 182 "ms", quad overline(x) = 41 "ms" $ #table( columns: 3, [*Endpoint*], [*p50*], [*p99*], [/search], [38 ms], [182 ms], [/orders], [44 ms], [167 ms], ) == Next steps + Cache search results for _30 seconds_ + Re-run with $n = 5000$ users ```sh k6 run --vus 5000 load.js ``` ”
“#set heading(numbering: "1.1") = Introduction <intro> == Motivation = Method <method> As argued in @intro and @knuth1984. #bibliography("refs.bib")”
“#include "chapters/intro.typ" #include "chapters/method.typ" #include "chapters/results.typ"”
“= Results The mean is $x = sum_(i=1)^n x_i / n. ”
“= Setup <setup> = Results <setup> See @setup.”
“Pythagoras: $a^2 + b^2 = c^2$, and $ integral_0^1 x^2 dif x = 1/3 $”
“#let total(items) = items.sum() #let fmt(n) = str(n) + " EUR" #show heading: set text(fill: blue) #show "TODO": highlight = Budget Total: #fmt(total((120, 80, 45)))”
“Email ada@example.com or see @fig-sales. #figure(image("sales.png"), caption: [Sales by quarter]) <fig-sales>”
Typst Markup at a Glance
Typst keeps everyday formatting short and puts everything else behind #, which switches to its scripting language. These ten pieces of syntax cover most documents, from a one-page letter to a thesis with numbered equations.
Headings
One = per level at the start of a line: = Title, == Section, === Subsection.
“How do you write a subsection?”
Emphasis
*Strong* text between stars and _emphasised_ text between underscores.
“How do you write bold text?”
Lists
- for bullets, + for numbered items and / Term: for a term list.
“What starts a numbered item?”
Maths
$x^2$ inline; spaces inside the dollars, as in $ x^2 $, make a block.
“What makes maths a block?”
Labels and References
<intro> after an element labels it, and @intro refers to it.
“How do you refer to <fig>?”
Function Calls
# calls a function in markup, as in #image("logo.png") or #table(…).
“What switches to code?”
Set Rules
#set text(size: 11pt) changes defaults for everything after it.
“How do you number headings?”
Show Rules
#show heading: set text(blue) restyles every element of a kind.
“Which rule restyles elements?”
Raw Text
`code` inline and ``` fences for blocks, with a language for highlighting.
“How do you start a Python block?”
Packages
#import "@preview/name:version" loads a package from Typst Universe.
“Where do @preview packages come from?”
Typst or LaTeX?
Typst was designed as an answer to LaTeX’s slow compiles and cryptic errors, and many people try it while writing their next paper. LaTeX still has decades of templates, packages and journal support behind it, so the choice depends on where the document is going.
Compile Speed
Typst recompiles only what changed, so previews update in milliseconds rather than seconds.
Error Messages
Typst points at the exact line and column with a short explanation. LaTeX errors often surface pages later.
Scripting
Typst has variables, functions and loops built in. LaTeX relies on macros and packages such as pgf.
Maths Syntax
Typst writes sum_(i=1)^n and a/b. LaTeX writes \sum_{i=1}^n and \frac{a}{b}.
Templates and Journals
Many journals and conferences only accept LaTeX. Typst Universe’s templates are growing but smaller.
Output
Both produce PDF. Typst also exports PNG and SVG, and has experimental HTML export.
What a Browser Preview Can and Can’t Do
The preview runs the same compiler as the Typst command line, but inside one browser tab with one file. A few things that work in a project folder behave differently here, and the check view lists each one it finds in your document.
One File
#include, images and bibliographies point at other files, which the preview can’t read.
Fonts
Only Typst’s default fonts are loaded. Other font names fall back with a warning.
Packages
Typst Universe packages are fetched from packages.typst.org. Your document isn’t sent.
No PDF Yet
Pages are drawn as SVG on screen. Download saves the .typ source for the Typst app or CLI.
Large Documents
Long books compile more slowly in the browser than on the command line.
Writing Maths in Typst
Typst’s maths mode is where people coming from LaTeX notice the biggest change. Symbols are written by name without backslashes, fractions use a plain slash, and functions take their arguments in parentheses rather than braces, which makes equations shorter to type and easier to read.
Fractions
a/b becomes a stacked fraction, and brackets around a numerator, as in (a+b)/2, group it and disappear from the output.
Scripts
x_i and x^2 work as in LaTeX, with brackets for longer scripts, as in sum_(i=1)^n.
Symbols by Name
Greek letters and symbols need no backslash: alpha, pi, infinity and arrow.r.
Words in Maths
Multi-letter words are read as names, so quote them, as in "if" or "ms", or Typst reports an unknown variable.
Alignment
& marks the alignment point and a backslash breaks the line in block maths.
Maths Functions
sqrt(x), root(3, x), vec(1, 2) and mat(1, 2; 3, 4) cover roots, vectors and matrices.
Typst Pitfalls
Mistakes that catch people moving from LaTeX or Markdown, most of which the compiler reports with a line and column once you know what to look for.
Stray Dollar Signs
A price like $5 opens maths. Escape it as \$5.
Hash in Text
# starts code, so write \# for a literal hash sign.
Missing Spaces in Block Maths
$x$ is inline; only $ x $ with inner spaces is a block.
Labels on the Wrong Element
A label applies to the element just before it, not the paragraph.
Markdown Habits
**double stars** and # Heading don’t work. Use *one star* and =.
Pinned Package Versions
Imports need an exact version, as in cetz:0.3.4, so update them on purpose.
When to Use a Typst Previewer
Whenever you want to see Typst output without installing the CLI or signing in to the web app, or you need to find out quickly why a document stopped compiling.
Trying Typst
Write a first document and see how markup becomes pages.
Debugging Errors
Paste a failing snippet and read the error in plain words.
Checking Structure
Outline a long chapter to confirm heading levels and labels.
Sharing Snippets
Test code from a forum or the docs before using it in a project.
Teaching
Show students how set and show rules change a page.