Cheatsheets:Quarto: Difference between revisions

From Wikibase
Jump to navigation Jump to search
Rewrite per style guide: source/rendered side-by-side basic example, fix multi-format syntax (map, not list), move notes into their sections, add document-wide execute options and Projects section (via update-page on MediaWiki MCP Server)
Standardize: add copy button to block code snippets
 
(6 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{Cheatsheet}}
{{Cheatsheet}}
Quarto is like modern Latex+Jupyter: a scientific and technical publishing system that converts Markdown text, YAML front matter, and executable code chunks into publishing-grade HTML, PDF, Word and
more.


<blockquote>
<blockquote>
Quarto is a scientific and technical publishing system: Markdown content, YAML
'''Quarto uses Markdown for prose content. If you are unfamiliar with Markdown syntax, see [[Cheatsheets:Markdown]].
front matter and executable code chunks that render to HTML, PDF, Word and
</blockquote>
more. It builds on Pandoc.
 
'''Quarto uses Markdown for prose content. If you are unfamiliar with Markdown syntax, see [[Cheatsheets:markdown]].


New to Quarto? You may find this
New to Quarto? You may find this
[https://quarto.org/docs/get-started/hello/ Get Started tutorial] interesting.
[https://quarto.org/docs/get-started/hello/ Get Started tutorial] interesting.
</blockquote>


== Basic example: Pancake recipe ==
== Basic example: Pancake recipe ==


A <syntaxhighlight lang="text" inline>.qmd</syntaxhighlight> file: YAML front matter between <syntaxhighlight lang="text" inline>---</syntaxhighlight> lines, then Markdown with a Python chunk. Render it with <syntaxhighlight lang="bash" inline>quarto render pancake.qmd</syntaxhighlight>:
A <syntaxhighlight lang="text" inline>.qmd</syntaxhighlight> file =
 
# YAML front matter +
# Markdown prose +
# Code chunks (usually python)


{| class="wikitable"
{| class="wikitable"
! Source (.qmd) !! Rendered (html)
! Source (.qmd) !! Rendered with <syntaxhighlight lang="bash" inline>quarto render pancake.qmd</syntaxhighlight> into html
|-
|-
|
|
<syntaxhighlight lang="markdown">
<syntaxhighlight lang="markdown" line copy>
---
---
title: "Pancake quantities"
title: "Pancake quantities"
Line 49: Line 53:
</ul>
</ul>
<p style="font-size:1.5em;font-weight:bold;">Batter volume</p>
<p style="font-size:1.5em;font-weight:bold;">Batter volume</p>
<syntaxhighlight lang="text">
<syntaxhighlight lang="text" copy>
Batter volume: 400 ml
Batter volume: 400 ml
</syntaxhighlight>
</syntaxhighlight>
Line 55: Line 59:
|}
|}


The chunk runs at render time. With <syntaxhighlight lang="yaml" inline>echo: false</syntaxhighlight> the source stays hidden; only the output appears in the document.
By default, the code chunks run at render time. <syntaxhighlight lang="yaml" inline>echo: false</syntaxhighlight> (14) in the example hides the source code, so only the output appears in the rendered document here.


== Front matter ==
== Front matter ==


YAML between <syntaxhighlight lang="text" inline>---</syntaxhighlight> lines at the top of the file:
* YAML  
* wrapped between two <syntaxhighlight lang="text" inline>---</syntaxhighlight> lines  
* always at the top of the file


<syntaxhighlight lang="yaml">
<syntaxhighlight lang="yaml" copy>
---
---
title: "Pancake quantities"
title: "Pancake quantities"
Line 87: Line 93:
|}
|}


Several formats at once — a '''map''', not a list. A list like <syntaxhighlight lang="yaml" inline>[html, pdf]</syntaxhighlight> fails at render time with <syntaxhighlight lang="text" inline>ERROR: Validation of YAML front matter failed</syntaxhighlight>. Declare each format instead:
Available <syntaxhighlight lang="yaml" inline>format</syntaxhighlight>:
 
{| class="wikitable"
! format !! output
|-
| <syntaxhighlight lang="yaml" inline>html</syntaxhighlight> || standalone HTML page
|-
| <syntaxhighlight lang="yaml" inline>pdf</syntaxhighlight> || PDF via LaTeX
|-
| <syntaxhighlight lang="yaml" inline>typst</syntaxhighlight> || PDF via the Typst engine bundled with Quarto
|-
| <syntaxhighlight lang="yaml" inline>docx</syntaxhighlight> || Word document
|-
| <syntaxhighlight lang="yaml" inline>revealjs</syntaxhighlight> || HTML slide deck
|-
| <syntaxhighlight lang="yaml" inline>gfm</syntaxhighlight> || GitHub Flavored Markdown
|}
 
HTML and PDF work out of the box. Others may require additional setup.
 
<blockquote>
'''Several formats at once — a map, not a list.''' A list fails at render time:
 
{| class="wikitable"
! Wrong !! Right
|-
|
<syntaxhighlight lang="yaml" copy>
format: [html, pdf]
</syntaxhighlight>


<syntaxhighlight lang="yaml">
Render error:
<syntaxhighlight lang="text" copy>
ERROR: Validation of YAML front matter failed
</syntaxhighlight>
||
<syntaxhighlight lang="yaml" copy>
format:
format:
   html: default
   html: default
   pdf: default
   pdf: default
</syntaxhighlight>
</syntaxhighlight>
Renders pancake.html and pancake.pdf.
|}
</blockquote>


<blockquote>
<blockquote>
'''A colon in an unquoted value must be quoted''' — it ends the mapping, and the render fails:
'''A colon in an unquoted value causes a fatal exception:'''


{| class="wikitable"
{| class="wikitable"
Line 102: Line 146:
|-
|-
|
|
<syntaxhighlight lang="yaml">
<syntaxhighlight lang="yaml" copy>
title: Pancakes: the recipe
title: Pancakes: the recipe
</syntaxhighlight>
</syntaxhighlight>


Render error:
Render error:
<syntaxhighlight lang="text">
<syntaxhighlight lang="text" copy>
ERROR: YAMLException: bad indentation of a mapping entry
ERROR: YAMLException: bad indentation of a mapping entry
</syntaxhighlight>
</syntaxhighlight>
||
||
<syntaxhighlight lang="yaml">
<syntaxhighlight lang="yaml" copy>
title: "Pancakes: the recipe"
title: "Pancakes: the recipe"
</syntaxhighlight>
</syntaxhighlight>
Line 119: Line 163:
== Code chunks ==
== Code chunks ==


A fenced block whose info string names a language '''in braces''' runs as code; the engine executes it and inserts the output:
* A fenced Markdown codeblock
* language name must be wrapped '''in <code>{</code> braces'''
* executed by the compile engine
* output inserted into rendered document


<syntaxhighlight lang="markdown">
<syntaxhighlight lang="markdown" copy>
```{python}
```{python}
print("hi")
print("hi")
Line 127: Line 174:
</syntaxhighlight>
</syntaxhighlight>


Engines include python (via Jupyter), r (via knitr), julia, bash and ojs.
Available languages: python (via Jupyter), r (via knitr), julia, bash, and ojs.


=== Chunk options ===
=== Chunk options ===


Lines starting with <syntaxhighlight lang="yaml" inline>#|</syntaxhighlight> at the top of the chunk configure it:
Lines starting with <syntaxhighlight lang="yaml" inline>#|</syntaxhighlight> at the top of the chunk modifies compile-time behaviour:


{| class="wikitable"
{| class="wikitable"
Line 147: Line 194:
|}
|}


'''echo''' — without it source and output both appear; with <syntaxhighlight lang="yaml" inline>echo: false</syntaxhighlight> only the output:
'''echo''' — without it source and output both appear; with <syntaxhighlight lang="yaml" inline>echo: false</syntaxhighlight> only the output.
 
Without (default):


{| class="wikitable"
{| class="wikitable"
! Without (default) !! With echo: false
! Source (in the .qmd) !! Rendered document
|-
|-
|
|
<syntaxhighlight lang="python">
<syntaxhighlight lang="python" copy>
flour = 150
milk = 250
print(f"Batter volume: {flour + milk} ml")
</syntaxhighlight>
||
<blockquote>
<syntaxhighlight lang="python" copy>
flour = 150
flour = 150
milk = 250
milk = 250
print(f"Batter volume: {flour + milk} ml")
print(f"Batter volume: {flour + milk} ml")
</syntaxhighlight>
</syntaxhighlight>
 
<syntaxhighlight lang="text" copy>
Output:
<syntaxhighlight lang="text">
Batter volume: 400 ml
Batter volume: 400 ml
</syntaxhighlight>
</syntaxhighlight>
||
</blockquote>
<syntaxhighlight lang="python">
|}
 
With <syntaxhighlight lang="yaml" inline>echo: false</syntaxhighlight>:
 
{| class="wikitable"
! Source (in the .qmd) !! Rendered document
|-
|
<syntaxhighlight lang="python" copy>
#| echo: false
#| echo: false
flour = 150
flour = 150
Line 170: Line 232:
print(f"Batter volume: {flour + milk} ml")
print(f"Batter volume: {flour + milk} ml")
</syntaxhighlight>
</syntaxhighlight>
||
<blockquote>
<syntaxhighlight lang="text" copy>
Batter volume: 400 ml
</syntaxhighlight>
</blockquote>
|}
'''eval: false''' — the source is shown but nothing runs, handy for scratch code you want to keep visible:


Output:
{| class="wikitable"
<syntaxhighlight lang="text">
! Source (in the .qmd) !! Rendered document
Batter volume: 400 ml
|-
|
<syntaxhighlight lang="python" copy>
#| eval: false
print("Batter volume: 400 ml")
</syntaxhighlight>
||
<blockquote>
<syntaxhighlight lang="python" copy>
print("Batter volume: 400 ml")
</syntaxhighlight>
</syntaxhighlight>
No output — the code never ran.
</blockquote>
|}
|}


'''eval: false''' — the source is shown but nothing runs, handy for scratch code you want to keep visible.
'''include: false''' — source and output both stay out of the document, for setup code the reader does not need to see:


'''include: false''' — source and output both stay out of the document, for setup code the reader does not need to see.
{| class="wikitable"
! Source (in the .qmd) !! Rendered document
|-
|
<syntaxhighlight lang="python" copy>
#| include: false
print("Batter volume: 400 ml")
</syntaxhighlight>
||
Nothing neither the source nor the output appears.
|}


<blockquote>
<blockquote>
Line 188: Line 280:
|-
|-
|
|
<syntaxhighlight lang="markdown">
<syntaxhighlight lang="markdown" copy>
```python
```python
print("hi")
print("hi")
Line 196: Line 288:
Nothing executes; the source shows as a plain code block.
Nothing executes; the source shows as a plain code block.
||
||
<syntaxhighlight lang="markdown">
<syntaxhighlight lang="markdown" copy>
```{python}
```{python}
print("hi")
print("hi")
Line 212: Line 304:
Set a chunk option for every chunk at once with <syntaxhighlight lang="yaml" inline>execute:</syntaxhighlight> in the front matter:
Set a chunk option for every chunk at once with <syntaxhighlight lang="yaml" inline>execute:</syntaxhighlight> in the front matter:


<syntaxhighlight lang="yaml">
<syntaxhighlight lang="yaml" copy>
---
---
title: "Pancake quantities"
title: "Pancake quantities"
Line 239: Line 331:
Give a section, table or figure an identifier, then refer to it with <syntaxhighlight lang="text" inline>@</syntaxhighlight>:
Give a section, table or figure an identifier, then refer to it with <syntaxhighlight lang="text" inline>@</syntaxhighlight>:


<syntaxhighlight lang="markdown">
<syntaxhighlight lang="markdown" copy>
## Recipe data {#sec-data}
## Recipe data {#sec-data}


The amounts live in @sec-data; see Table @tbl-pan.
The amounts live in @sec-data; the table is @tbl-pan and the figure is @fig-batter.


| Ingredient | Amount |
| Ingredient | Amount |
Line 249: Line 341:


: Pancake ingredients {#tbl-pan}
: Pancake ingredients {#tbl-pan}
```{python}
#| label: fig-batter
#| fig-cap: "Batter volume"
import matplotlib.pyplot as plt
plt.bar(["flour", "milk"], [150, 250])
plt.show()
```
</syntaxhighlight>
</syntaxhighlight>


The reference <syntaxhighlight lang="text" inline>@sec-data</syntaxhighlight> renders as "Section 1", the
The references render as "Section 1", "Table 1" and "Figure 1"; the table caption
table caption becomes "Table 1: Pancake ingredients", and figures are
becomes "Table 1: Pancake ingredients" and the figure caption "Figure 1: Batter
referenced the same way with <syntaxhighlight lang="text" inline>@fig-label</syntaxhighlight>.
volume". Quarto numbers each target by the order it appears in the document.


== Formats ==
== Projects ==


The <syntaxhighlight lang="yaml" inline>format</syntaxhighlight> key picks the output. HTML and PDF work out of the box:
A directory with a <syntaxhighlight lang="text" inline>_quarto.yml</syntaxhighlight> file is a '''project''': documents share its front matter and render as one site. A website project looks like this:


{| class="wikitable"
<syntaxhighlight lang="text" copy>
! format !! output
my-site/
|-
├── _quarto.yml  # project config: type, site settings, formats
| <syntaxhighlight lang="yaml" inline>html</syntaxhighlight> || standalone HTML page
├── index.qmd    # home page
|-
├── about.qmd    # second page
| <syntaxhighlight lang="yaml" inline>pdf</syntaxhighlight> || PDF via LaTeX
├── styles.css    # custom styles for the html format
|-
└── _site/       # built site (generated by quarto render)
| <syntaxhighlight lang="yaml" inline>typst</syntaxhighlight> || PDF via the Typst engine bundled with Quarto
</syntaxhighlight>
|-
| <syntaxhighlight lang="yaml" inline>docx</syntaxhighlight> || Word document
|-
| <syntaxhighlight lang="yaml" inline>revealjs</syntaxhighlight> || HTML slide deck
|-
| <syntaxhighlight lang="yaml" inline>gfm</syntaxhighlight> || GitHub Flavored Markdown
|}
 
== Projects ==


A directory with a <syntaxhighlight lang="text" inline>_quarto.yml</syntaxhighlight> file is a '''project''': documents share its front matter and render as one site. Scaffold one:
Scaffold one:


<syntaxhighlight lang="bash">
<syntaxhighlight lang="bash" copy>
quarto create-project --type website
quarto create-project --type website
</syntaxhighlight>
</syntaxhighlight>


creates <syntaxhighlight lang="text" inline>index.qmd</syntaxhighlight>, <syntaxhighlight lang="text" inline>about.qmd</syntaxhighlight>, <syntaxhighlight lang="text" inline>styles.css</syntaxhighlight> and <syntaxhighlight lang="text" inline>_quarto.yml</syntaxhighlight>. The scaffolded project file:
creates <syntaxhighlight lang="text" inline>index.qmd</syntaxhighlight>, <syntaxhighlight lang="text" inline>about.qmd</syntaxhighlight>, <syntaxhighlight lang="text" inline>styles.css</syntaxhighlight> and <syntaxhighlight lang="text" inline>_quarto.yml</syntaxhighlight>. The scaffolded project file, key parts annotated:


<syntaxhighlight lang="yaml">
<syntaxhighlight lang="yaml" copy>
project:
project:
   type: website
   type: website             # website, book, default, manuscript


website:
website:
   title: "webproj"
   title: "My site"           # shown in the browser tab and navbar
   navbar:
   navbar:
     left:
     left:                   # links on the left of the navigation bar
       - href: index.qmd
       - href: index.qmd
         text: Home
         text: Home
Line 300: Line 391:
   html:
   html:
     theme:
     theme:
       - cosmo
       - cosmo               # Bootstrap theme
       - brand
       - brand               # brand color palette
     css: styles.css
     css: styles.css         # extra stylesheet
     toc: true
     toc: true               # table of contents on each page
</syntaxhighlight>
</syntaxhighlight>


Render the whole project:
Render the whole project:


<syntaxhighlight lang="bash">
<syntaxhighlight lang="bash" copy>
quarto render
quarto render
</syntaxhighlight>
</syntaxhighlight>

Latest revision as of 09:45, 23 August 2026

Quick reference for smart people — part of our dev cheatsheets collection.


Quarto is like modern Latex+Jupyter: a scientific and technical publishing system that converts Markdown text, YAML front matter, and executable code chunks into publishing-grade HTML, PDF, Word and more.

Quarto uses Markdown for prose content. If you are unfamiliar with Markdown syntax, see Cheatsheets:Markdown.

New to Quarto? You may find this Get Started tutorial interesting.

Basic example: Pancake recipe

A .qmd file =

  1. YAML front matter +
  2. Markdown prose +
  3. Code chunks (usually python)
Source (.qmd) Rendered with quarto render pancake.qmd into html
---
title: "Pancake quantities"
format: html
---

## Ingredients

- 150 g flour
- 250 ml milk

## Batter volume

```{python}
#| echo: false
flour = 150
milk = 250
print(f"Batter volume: {flour + milk} ml")
```

Pancake quantities

Ingredients

  • 150 g flour
  • 250 ml milk

Batter volume

Batter volume: 400 ml

By default, the code chunks run at render time. echo: false (14) in the example hides the source code, so only the output appears in the rendered document here.

Front matter

  • YAML
  • wrapped between two --- lines
  • always at the top of the file
---
title: "Pancake quantities"
author: "Ada"
date: today
format: html
toc: true
---
Key Effect
title: "Pancakes" document title
author: Ada author; a list of authors: [Ada, Bo]
date: today date; the magic value today becomes the current date at render time
format: html output format
toc: true table of contents
lang: en document language

Available format:

format output
html standalone HTML page
pdf PDF via LaTeX
typst PDF via the Typst engine bundled with Quarto
docx Word document
revealjs HTML slide deck
gfm GitHub Flavored Markdown

HTML and PDF work out of the box. Others may require additional setup.

Several formats at once — a map, not a list. A list fails at render time:

Wrong Right
format: [html, pdf]

Render error:

ERROR: Validation of YAML front matter failed
format:
  html: default
  pdf: default

Renders pancake.html and pancake.pdf.

A colon in an unquoted value causes a fatal exception:

Wrong Right
title: Pancakes: the recipe

Render error:

ERROR: YAMLException: bad indentation of a mapping entry
title: "Pancakes: the recipe"

Code chunks

  • A fenced Markdown codeblock
  • language name must be wrapped in { braces
  • executed by the compile engine
  • output inserted into rendered document
```{python}
print("hi")
```

Available languages: python (via Jupyter), r (via knitr), julia, bash, and ojs.

Chunk options

Lines starting with #| at the top of the chunk modifies compile-time behaviour:

Option Effect Example
echo show the source (default true) #| echo: false
eval run the code (default true) #| eval: false
include keep source and output in the document (default true) #| include: false
label chunk label, referenced with @label #| label: fig-batter
fig-cap caption for figure output #| fig-cap: "Batter volume"

echo — without it source and output both appear; with echo: false only the output.

Without (default):

Source (in the .qmd) Rendered document
flour = 150
milk = 250
print(f"Batter volume: {flour + milk} ml")
flour = 150
milk = 250
print(f"Batter volume: {flour + milk} ml")
Batter volume: 400 ml

With echo: false:

Source (in the .qmd) Rendered document
#| echo: false
flour = 150
milk = 250
print(f"Batter volume: {flour + milk} ml")
Batter volume: 400 ml

eval: false — the source is shown but nothing runs, handy for scratch code you want to keep visible:

Source (in the .qmd) Rendered document
#| eval: false
print("Batter volume: 400 ml")
print("Batter volume: 400 ml")

No output — the code never ran.

include: false — source and output both stay out of the document, for setup code the reader does not need to see:

Source (in the .qmd) Rendered document
#| include: false
print("Batter volume: 400 ml")

Nothing — neither the source nor the output appears.

A fence without braces is a static code block — it never runs. A chunk that "does nothing" is usually this:

Wrong Right
```python
print("hi")
```

Nothing executes; the source shows as a plain code block.

```{python}
print("hi")
```

The engine runs it and inserts the output.

The inline form follows the same rule — see Inline code.

Options for the whole document

Set a chunk option for every chunk at once with execute: in the front matter:

---
title: "Pancake quantities"
format: html
execute:
  echo: false
---

Every chunk hides its source; the outputs still appear. A #| option on one chunk overrides the document default.

Inline code

Inline code executes when the language is named in braces:

Source Renders as
`{python} flour + milk` 400
`flour + milk` flour + milk (literal, not evaluated)

Cross-references

Give a section, table or figure an identifier, then refer to it with @:

## Recipe data {#sec-data}

The amounts live in @sec-data; the table is @tbl-pan and the figure is @fig-batter.

| Ingredient | Amount |
|---|---|
| Flour | 150 g |

: Pancake ingredients {#tbl-pan}

```{python}
#| label: fig-batter
#| fig-cap: "Batter volume"
import matplotlib.pyplot as plt
plt.bar(["flour", "milk"], [150, 250])
plt.show()
```

The references render as "Section 1", "Table 1" and "Figure 1"; the table caption becomes "Table 1: Pancake ingredients" and the figure caption "Figure 1: Batter volume". Quarto numbers each target by the order it appears in the document.

Projects

A directory with a _quarto.yml file is a project: documents share its front matter and render as one site. A website project looks like this:

my-site/
├── _quarto.yml   # project config: type, site settings, formats
├── index.qmd     # home page
├── about.qmd     # second page
├── styles.css    # custom styles for the html format
└── _site/        # built site (generated by quarto render)

Scaffold one:

quarto create-project --type website

creates index.qmd, about.qmd, styles.css and _quarto.yml. The scaffolded project file, key parts annotated:

project:
  type: website              # website, book, default, manuscript

website:
  title: "My site"           # shown in the browser tab and navbar
  navbar:
    left:                    # links on the left of the navigation bar
      - href: index.qmd
        text: Home
      - about.qmd

format:
  html:
    theme:
      - cosmo                # Bootstrap theme
      - brand                # brand color palette
    css: styles.css          # extra stylesheet
    toc: true                # table of contents on each page

Render the whole project:

quarto render

builds the site into _site/.

CLI

Command What it does
quarto render file.qmd render one file, or a whole project
quarto render file.qmd --to pdf override the output format
quarto preview live-render preview while editing
quarto create-project --type website scaffold a project (default, book, website, manuscript)
quarto publish gh-pages publish the built site to GitHub Pages; other providers: netlify, quarto-pub, …

Further reading