Callouts
Five native types
The extension maps native Quarto types to a fixed visual meaning: note is muted blue with info, tip is teal with flame, important is lavender with circle alert, warning is amber with triangle alert, and caution is coral with octagon alert. The icons are bundled local Lucide SVGs, exposed as CSS masks rather than a new runtime.
The shell, title, semantic alpha border and fill, 5px radius, icon, and chevron follow Quartz’s callout showcase as closely as Quarto’s DOM permits. Quarto’s five native types, their collapse behavior, and nested callouts are the current interface. Quartz’s additional families and aliases are not invented here.
The five types
Use note for context that informs but does not interrupt the main thread.
Use tip for a helpful practice. The icon remains the flame at all depths.
Use important for a material reader decision.
Use warning when readers should inspect a condition before proceeding.
Use caution for a concrete risk whose consequence should remain visible.
Edge cases
Long custom titles remain part of the native header.
This body is available through Quarto’s own disclosure control. Askr replaces the chevron graphic and keeps the control centered with the title.
Nested callouts
The teal parent gives a helpful orientation.
The lavender child carries the important condition, rather than inheriting teal.
Limits
The theme contains a long native title and a nested callout without letting either widen the page. Do not put a table, a figure, and several paragraphs inside one callout; move that material into the article and leave the callout as the warning.