← All diagram types

Mermaid mindmap syntax: hierarchy, node shapes and branches with examples

Mermaid mindmap syntax with rendered examples: indentation-built branches, root and node shapes, line breaks in labels and multi-level topics.

A mindmap is a tree drawn as one central idea with branches: a plan, an outline, a breakdown of a topic. Mermaid's mindmap builds it from indentation alone — there are no edges to write, and no ids unless you want shapes.

Everything on this page is rendered by makesPDF's own Mermaid renderer, so a ```mermaid block produces exactly this in the PDF.

Branches are indentation

The first line under mindmap is the root. Lines indented under it are its children, deeper lines their children, and so on. A line's parent is the nearest line above it with less indentation:

mermaid
mindmap
  root((Project launch))
    Plan
      Define goals
      Draft timeline
      Assign owners
    Build
      Design system
      Page templates
    Launch
      Beta
      Announcement

Spaces or tabs both work; use one or the other consistently. The root is the only node whose shape usually matters.

Node shapes

A node can carry an id and a shape with the same bracket syntax Mermaid uses elsewhere: [square], (rounded), ((circle)), ))bang((, )cloud(, {{hexagon}}:

mermaid
mindmap
  root((Website redesign))
    plan[Plan]
      audit(Audit current site)
      goals(Define goals)
    design{{Design}}
      Wireframes
      Visual mockups
    build[Build]
      Frontend implementation
      CMS integration

The shape markers can wrap the root as well: root[Website redesign] gives it a square instead of a circle.

Line breaks in a label

<br/> inside a label starts a new line, which keeps a long branch from stretching the diagram sideways:

mermaid
mindmap
  root((Release plan))
    Documentation
      API reference<br/>and examples
      Migration guide
    Testing
      Accessibility audit
      Load tests

Depth and breadth

Branch colour follows the root's children — everything under one first-level branch shares a colour — so the diagram reads as groups rather than as one long list. Keep first-level branches to four or five and push detail down:

mermaid
mindmap
  root((Support))
    Self service
      Help centre
      Status page
    Assisted
      Email
      Live chat
    Engineering
      Bug triage
      Runbooks

Not supported in makesPDF yet: the tree fans out to the right of the root only — there is no left/right balancing of branches. ::icon(...) markers and :::class styling are parsed but not drawn, and a label's <br/> is the only way to break a line.