Skip to main content
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

Get started for freeTalk to us