Hematite Theme Hematite Theme

Remark and Mermaid

Monday, 05/23/2022

The upcoming release of Hematite comes with Mermaid-js bundled!

To enable it (like KaTeX\KaTeX), add mermaid: true to your frontmatter. For example, on this page,

---
layout: post
title: "Remark and Mermaid"
mermaid: true
katex: true
---

Mermaid allows diagram creation. For example,

<!-- Creates a flowchart from left to right -->
<div class="mermaid">
flowchart LR
    id1[Item 1]
    id2[Another item]

    id1 -- Label --> id2
</div>

renders as

Label
Item 1
Another item

See this demo for an example of Remark slides.