mermaidjs-v11

Create text-based diagrams using Mermaid.js v11 declarative syntax. Convert code to SVG/PNG/PDF via CLI or render in browsers/markdown files.

Basic Diagram Structure:

```

{diagram-type}

{diagram-content}

```

Common Diagram Types:

• flowchart - Process flows, decision trees
• sequenceDiagram - Actor interactions, API flows
• classDiagram - OOP structures, data models
• stateDiagram - State machines, workflows
• erDiagram - Database relationships
• gantt - Project timelines
• journey - User experience flows

See references/diagram-types.md for all 24+ types with syntax.

Inline Markdown Code Blocks:

````markdown

```mermaid

flowchart TD

A[Start] --> B{Decision}

B -->|Yes| C[Action]

B -->|No| D[End]

```

````

Configuration via Frontmatter:

````markdown

```mermaid

---

theme: dark

---

flowchart LR

A --> B

```

````

Comments: Use %% prefix for single-line comments.

Convert .mmd files to images:

```bash

# Installation

npm install -g @mermaid-js/mermaid-cli

# Basic conversion

mmdc -i diagram.mmd -o diagram.svg

# With theme and background

mmdc -i input.mmd -o output.png -t dark -b transparent

# Custom styling

mmdc -i diagram.mmd --cssFile style.css -o output.svg

```

See references/cli-usage.md for Docker, batch processing, and advanced workflows.

HTML Embedding:

```html

  flowchart TD
    A[Client] --> B[Server]

```

See references/integration.md for Node.js API and advanced integration patterns.

Common Options:

• theme: "default", "dark", "forest", "neutral", "base"
• look: "classic", "handDrawn"
• fontFamily: Custom font specification
• securityLevel: "strict", "loose", "antiscript"

See references/configuration.md for complete config options, theming, and customization.

Load references/examples.md for:

• Architecture diagrams
• API documentation flows
• Database schemas
• Project timelines
• State machines
• User journey maps

• references/diagram-types.md - Syntax for all 24+ diagram types
• references/configuration.md - Config, theming, accessibility
• references/cli-usage.md - CLI commands and workflows
• references/integration.md - JavaScript API and embedding
• references/examples.md - Practical patterns and use cases