Naiad

A .NET library for rendering Mermaid diagrams to SVG. No browser or JavaScript runtime required.

NuGet package

https://nuget.org/packages/Naiad/

Usage

var svg = Mermaid.Render(
    """
    flowchart LR
        A[Start] --> B[Process] --> C[End]
    """);

The diagram type is automatically detected from the input.

Render Options

var svg = Mermaid.Render(
    input,
    new RenderOptions
    {
        Padding = 20,
        FontSize = 14,
        FontFamily = "Arial, sans-serif"
    });

Icon packs

Naiad can render icons from iconify icon packs. Packs are not bundled — load the ones you need (in the iconify JSON format) from a file or a stream:

IconPack.Load("logos.json");

// ...or from a stream
using var stream = File.OpenRead("logos.json");
IconPack.Load(stream);

Pack files are published as @iconify-json/* packages (the icons.json file), e.g. @iconify-json/logos. Load registers the pack under its prefix and returns it. Register all packs once at startup — calling IconPack.Load after the first Mermaid.Render throws a MermaidException.

Once loaded, reference icons as prefix:name wherever a diagram supports icons — architecture services and groups, flowchart node labels, and mindmap nodes:

// Architecture
Mermaid.Render(
    """
    architecture-beta
    service fn(logos:aws-lambda)[Lambda]
    service db(logos:postgresql)[Database]
    fn:R -- L:db
    """);

// Flowchart (inline in labels)
Mermaid.Render(
    """
    flowchart LR
        A[logos:redis Cache] --> B[logos:postgresql DB]
    """);

// Mindmap
Mermaid.Render(
    """
    mindmap
      Project
        Storage ::icon(logos:aws-s3)
    """);

Single-color icons (e.g. mdi, tabler) inherit the surrounding color; multi-color icons (e.g. logos) keep their own palette.

FontAwesome icons also work in flowcharts (fa:fa-name) and mindmaps (::icon(fa fa-name)) without loading a pack.

Supported Diagram Types

• Flowchart / Graph
• Sequence Diagram
• Class Diagram
• State Diagram
• Entity Relationship Diagram
• Gantt Chart
• Pie Chart
• Git Graph
• Mindmap
• Timeline
• User Journey
• Quadrant Chart
• Requirement Diagram
• C4 Diagrams (Context, Container, Component, Deployment)
• Kanban
• XY Chart (beta)
• Sankey (beta)
• Block Diagram (beta)
• Packet Diagram (beta)
• Architecture (beta)
• Radar (beta)
• Treemap (beta)

Test Renders

Auto-generated documentation from the test suite.

• C4
• Class
• EntityRelationship
• Flowchart
• Gantt
• GitGraph
• Kanban
• Mindmap
• Pie
• Quadrant
• Requirement
• Sequence
• State
• Timeline
• UserJourney

Beta diagram types

• Architecture
• Block
• Packet
• Radar
• Sankey
• Treemap
• XYChart

Icon

Naiad designed by Icons Producer from The Noun Project.