Marp TikZ Plus

Marp TikZ

Render TikZ/LaTeX diagrams directly in Obsidian notes, and author full Marp slide presentations — complete with Slide Navigator, Speaker Notes panel, and one-click PPTX export with native math objects.

Desktop only. Rendering runs locally via a WASM-based TeX engine — no internet required.

Also available for VS Code:

---

Gallery

More TikZ diagram examples: Decoding the Taalas HC1 — A Quantitative Analysis

---

Features

• TikZ rendering — Live SVG rendering of tikz fenced code blocks in Reading view
• Rich package support — chemfig, circuitikz, pgfplots, tikz-cd, tikz-3dplot, amsmath, and more
• Dark mode — Automatic color inversion for dark themes
• External file include — Reference .tikz files with %!include; auto-refreshes on save
• Smart caching — Two-level cache (memory + persistent); unchanged diagrams load instantly
• Marp preview — Full slide rendering via @marp-team/marp-core (no other plugins required)
• Slide Navigator — Thumbnail sidebar; click any slide to jump to it in the editor
• Speaker Notes panel — Live notes extracted from Marp HTML comments, rendered as full Markdown
• PPTX / PDF export — Export Marp decks via marp-cli with native PowerPoint math (OMML), not images
• CJK font injection — Automatically injects Noto Sans SC so Chinese/Japanese/Korean text renders correctly in exported files

---

Quick Start

TikZ diagrams

Add a tikz fenced code block in any Markdown file:

```tikz
\begin{document}
\begin{tikzpicture}
  \draw[thick, ->] (0,0) -- (2,0) node[right] {$x$};
  \draw[thick, ->] (0,0) -- (0,2) node[above] {$y$};
  \draw[blue, thick] (0,0) circle (1);
\end{tikzpicture}
\end{document}
```

Switch to Reading view — the diagram renders inline.

Marp presentations

Add marp: true to the frontmatter:

---
marp: true
---

# My Presentation

```tikz
\begin{document}
\begin{tikzpicture}
  \node[circle, draw] (a) at (0,0) {A};
  \node[circle, draw] (b) at (3,0) {B};
  \draw[->] (a) -- (b);
\end{tikzpicture}
\end{document}
```

Then open the Marp preview, Slide Navigator, or Speaker Notes via the command palette (Cmd+P / Ctrl+P).

---

Marp Slide Decks

TikZ diagrams work inside Marp slide decks. Add marp: true to your frontmatter and use tikz code blocks as usual.

Diagram sizing in Marp

Marp renders slides at a fixed 1280×720 resolution. TikZ diagrams may appear smaller than in standard Reading view. Use TikZ's scale option to compensate:

```tikz
\begin{document}
\begin{tikzpicture}[scale=2]
  \draw (0,0) rectangle (3,2);
  \node at (1.5,1) {\Large Hello!};
\end{tikzpicture}
\end{document}
```

A scale=2 factor generally produces a similar visual size to standard Reading view.

---

External File Include

Store diagrams in separate .tikz files and reference them with %!include:

```tikz
%!include diagrams/circuit.tikz
```

The included file should contain complete TikZ code:

\usepackage{circuitikz}
\begin{document}
\begin{circuitikz}
  \draw (0,0) to[battery1, l=$V$] (0,3)
        to[R=$R_1$] (3,3)
        to[R=$R_2$] (3,0)
        -- (0,0);
\end{circuitikz}
\end{document}

• Paths are relative to the Markdown file's directory
• The preview auto-refreshes when you save the included file
• Per-file caching — unchanged files are not re-read or re-rendered

---

Frontmatter & Speaker Notes Include

Use %!include to share YAML theme configuration and speaker notes across multiple Marp files.

Shared frontmatter

Place %!include filename.yaml inside the frontmatter block:

---
marp: true
%!include _theme.yaml
author: Alice
---

_theme.yaml contains the YAML keys to merge:

theme: default
paginate: true
backgroundColor: white

Shared speaker notes

Add %!notes filename.md anywhere inside a slide body:

# My Slide

%!notes notes/slide1.md

notes/slide1.md can contain any Markdown:

## Key points

- Remember to mention the benchmark results
- Audience question likely: *why not use approach X?*

Both include types resolve relative paths from the Markdown file's directory and auto-refresh when the included file is saved.

---

Marp Slide Navigator

Open Slide Navigator via the command palette to see slide thumbnails in a sidebar. Click any thumbnail to move the editor cursor to that slide.

• Keyboard navigation — Press ↑/↓ in the slide preview to switch pages with smooth animation
• Speaker notes — Toggle the notes panel to see per-slide notes rendered as full Markdown

---

Speaker Notes

Notes are extracted from HTML comments in your Markdown:

<!-- This appears as a speaker note for the current slide -->

Use Open Speaker Notes to open the panel. Notes render as full Markdown — bold, italic, code, lists, tables, headings, and links.

---

PPTX Export

Prerequisites (for PPTX / PDF export only):

• marp-cli v4.1.0+: npm install -g @marp-team/marp-cli
• LibreOffice (required by marp-cli for editable PPTX)

A ribbon icon (file-down) provides quick access to export. Export pipeline:

1. Render all TikZ diagrams to SVG
2. Run marp-cli --pptx-editable to produce a .pptx
3. Post-process: fix LibreOffice overlay shapes, inject native math (OMML), inject speaker notes
4. Save output next to the source file (timestamped)

Math in PPTX

LaTeX math in slides is converted to native PowerPoint math objects (OMML), not images. Formulas are fully editable in PowerPoint and render crisply at any zoom level.

• Display math ($$...$$) is centered with automatic vertical space
• Inline math preserves \quad/\qquad spacing
• \mathbf, \mathit, \hat, \sum, \prod, \int and other accents/nary operators render natively

---

Commands

Open the command palette (Cmd+P / Ctrl+P) and search for Marp TikZ:

---

Settings

Open Settings → Community Plugins → Marp TikZ:

---

Supported Packages

---

Troubleshooting

Diagrams not rendering — Switch to Reading view (not Live Preview). Check that the code block uses the tikz language identifier.

Slow rendering — First render compiles WASM; subsequent renders use the cache. Increase the render timeout in settings for complex diagrams.

Preview not updating — Use Refresh TikZ diagrams. If that doesn't help, try Reset TikZJax engine.

CJK text in exported files — CJK font injection is automatic. If Chromium still can't resolve the font, ensure you have internet access during export (the font is fetched from Google Fonts at export time).

PPTX export fails — Confirm marp-cli and LibreOffice are installed and accessible from your PATH.

---

Acknowledgments

• node-tikzjax by @drgrice1 — WASM-based TeX rendering engine
• TikZJax by @kisonecat — original browser-based TikZ compiler
• obsidian-tikzjax by @artisticat1 — original Obsidian TikZ plugin
• @marp-team/marp-core — Marp slide rendering engine

---

License

MIT — see LICENSE for details.