Renderer modes

The same diagram can move through three distinct visual paths: standard Mermaid, Mermaid sketch mode, and Excalidraw

Standard Mermaid

flowchart LR
  Source["Mermaid source"] --> Parse["Mermaid parser"]
  Parse --> Svg["clean SVG output"]

Loading diagram…

Mermaid sketch mode

flowchart LR
  Source["Mermaid source"] --> Parse["Mermaid parser"]
  Parse --> Svg["sketch-styled SVG output"]

Loading diagram…

Excalidraw renderer

flowchart LR
  Source["Mermaid source"] --> Convert["Mermaid to Excalidraw"]
  Convert --> Svg["rough SVG output"]

Loading diagram…

Reading the trade-off

• Mermaid.js stays closest to the original Mermaid theme system
• Mermaid sketch mode keeps Mermaid layout but changes the visual tone
• Excalidraw changes the renderer and the visual language together