Prism

One source, split into format-specific attributes.

What the prism extension is for, how to enable it, and the smallest attribute that differs between two output formats.

A paragraph that needs one size on a slide and another on a page usually ends up written twice, once inside each content-visible block, and the two copies drift.

prism keeps one copy. An attribute written revealjs:style="…" applies under revealjs and nowhere else; the prose beneath it is written once and read by every format.

The name is the metaphor: one source, split into format-specific outputs.

Installation

quarto add mcanouil/quarto-prism@0.4.2

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:

Quick start

Enable the filter:

filters:
  - prism

Then prefix any attribute with a format name and a colon:

::: {html:style="color: firebrick;" revealjs:style="color: deepskyblue;"}
Firebrick on a page, deep sky blue on a slide.
:::

Under html that resolves to style="color: firebrick;", and the revealjs: attribute is dropped:

Firebrick on a page, deep sky blue on a slide.

It works on divs, spans, headings, and code blocks.

Important

The prefix is the name of the format Quarto is targeting, and a custom format is not its base writer. These pages are built by atelier-html, so the paragraph above is written atelier-html:style rather than html:style; written the other way it would resolve to nothing. See the reference.

Seeing both sides

This site is HTML, so every html: prefix on it resolves. The Typst preview is the same site rendered to another format, where the typst: prefixes resolve instead and the html: ones are dropped.

See the Reference for the precedence rules, and the Examples for each of them resolved.

Where it works

Every output format. The filter rewrites attributes before any writer runs, so the mechanism is the same everywhere; only the values differ.

Back to top