Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/mermaid-js/mermaid/llms.txt

Use this file to discover all available pages before exploring further.

Configures Mermaid with global settings that apply to all diagrams. This method should be called before rendering any diagrams with run() or render().

Signature

function initialize(config: MermaidConfig): void

Parameters

config
MermaidConfig
required
Configuration object containing settings for Mermaid rendering.Common configuration options:

Return value

void - This method does not return a value.

Examples

Basic initialization

import mermaid from 'mermaid';

mermaid.initialize({
  theme: 'dark',
  logLevel: 'error',
  securityLevel: 'strict'
});

Custom theme configuration

mermaid.initialize({
  theme: 'base',
  themeVariables: {
    primaryColor: '#ff6b6b',
    primaryTextColor: '#fff',
    primaryBorderColor: '#ff6b6b',
    lineColor: '#f5a442',
    secondaryColor: '#4ecdc4',
    tertiaryColor: '#ffe66d'
  },
  fontFamily: 'Arial, sans-serif'
});

Configuration for automatic rendering

mermaid.initialize({
  startOnLoad: true,
  theme: 'default'
});

// Diagrams with class="mermaid" will be automatically rendered

Deterministic IDs for testing

mermaid.initialize({
  deterministicIds: true,
  deterministicIDSeed: 'test-seed'
});

Usage notes

  • Call initialize() before using run() or render()
  • Can be called multiple times to update configuration
  • Configuration merges with existing settings
  • When theme is specified, appropriate theme variables are automatically applied
  • The fontFamily setting is propagated to themeVariables.fontFamily if not already set
  • run() - Render all diagrams on the page
  • render() - Render a single diagram to SVG

Build docs developers (and LLMs) love