render

Convert Markdown documents to self-contained HTML and print-ready PDF using Quarto and headless Chrome.

Updated Nov 21, 2025
One-click install
npx skills add https://github.com/alatyshau/duet --skill render-alatyshau
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: render
Source: https://github.com/alatyshau/duet/tree/main/packages/skills/tools/render
Command: npx skills add https://github.com/alatyshau/duet --skill render-alatyshau

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires quarto, google-chrome.

What problem does it solve? Turning Markdown into polished HTML and PDF is surprisingly painful: pandoc with xelatex fails on emoji, Mermaid diagrams need separate tooling, and the output often looks dated. This Skill provides a proven two-command pipeline that handles emoji, Mermaid, Cyrillic, math, code highlighting, and PDF bookmarks out of the box. ## Core Features & Use Cases - Markdown to HTML: Quarto renders MD into a self-contained HTML file with Bootstrap theme, sidebar TOC, syntax highlighting, and embedded Mermaid diagrams. - HTML to PDF: Headless Chrome prints the rendered page to PDF, preserving emoji glyphs, SVG diagrams, and generating a PDF bookmark outline from headings. - Per-folder print settings: A render.css file placed next to the markdown carries page size, margins, fonts, and page-break rules so documents rebuild identically over time. - Use Case: You have a project specification in Markdown with Mermaid architecture diagrams and emoji markers. Run the pipeline to produce a shareable HTML file and a print-ready PDF with a clickable table of contents. ## Quick Start Render the attached Markdown file into both HTML and PDF with a sidebar table of contents and Mermaid diagrams included.

Frequently Asked Questions about render

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert Markdown to PDF with Mermaid diagrams?

Render the Markdown to HTML with Quarto, which executes Mermaid blocks into SVG, then print the HTML to PDF with headless Chrome. Copy the file to a .qmd shim first, since Quarto only runs {mermaid} blocks in .qmd files.

How to render Markdown to HTML with a sidebar table of contents?

Run quarto render with --metadata toc:true, toc-location:left, and toc-depth:3. Quarto generates a Bootstrap-themed HTML page with a clickable sidebar TOC, and embed-resources:true makes the file fully self-contained.

Why do emoji disappear when converting Markdown to PDF?

Emoji vanish when the PDF path goes through LaTeX or typst, which lack color emoji fonts. Rendering HTML first and printing via headless Chrome preserves emoji because Chrome uses Apple Color Emoji on macOS or Noto Color Emoji on Linux.

Why does headless Chrome produce an empty PDF from HTML?

Chrome silently outputs an empty PDF when given a relative file:// URL. Always pass an absolute file:// path, and include --virtual-time-budget so JavaScript like Mermaid finishes rendering before the print snapshot.

How do I add PDF bookmarks when printing HTML with Chrome?

Pass --generate-pdf-document-outline to headless Chrome. This emits PDF bookmarks from the h1 through h6 headings, so the Preview or Acrobat sidebar mirrors the document's heading tree.

When should I avoid pandoc with xelatex for Markdown to PDF?

Avoid pandoc --pdf-engine=xelatex when documents contain emoji or Mermaid diagrams. Emoji require fragile font configuration that often fails, and Mermaid needs a separate filter, making the HTML-plus-Chrome pipeline more dependable.