YAML Frontmatter

Add YAML frontmatter at the top of your .mmd files to configure diagram-specific settings like themes, fonts, and layout options.

Basic Syntax

Frontmatter is enclosed between --- delimiters at the start of your file:

---
title: User Authentication Flow
config:
  theme: dark
  look: handDrawn
---
flowchart TD
    A[Login Page] --> B{Valid credentials?}
    B -->|Yes| C[Dashboard]
    B -->|No| D[Error Message]

The frontmatter block gets full YAML syntax highlighting and validation.

Common Configuration Options

Theme

Set the diagram theme:

---
config:
  theme: forest
---

Available themes: default, dark, forest, neutral, base

Title

Add a title that appears above your diagram:

---
title: System Architecture
---

Diagram-Specific Settings

Each diagram type has its own configuration options:

---
config:
  flowchart:
    curve: basis
    padding: 20
  sequence:
    mirrorActors: false
---

Reference

For all available configuration options, see the Mermaid.js configuration documentation.