Formatting

This feature requires a paid license. With a Core license, available for Flowchart, Sequence, Class, State, ER, and Block diagrams. With a Studio license, available for all diagram types. Compare editions →

Mermaid Studio can automatically format your diagram code to improve readability and apply a consistent indentation and spacing style. Reformatting will also fix many minor syntax issues caused by missing or misplaced whitespace.

Reformatting a diagram

Press Option + Command + L OptionCmdL Control + Alt + L CtrlAltL in the editor to reformat the entire file, or select a range first to reformat just that range. Reformat is also available under Code > Reformat Code and from the editor context menu.

For diagrams embedded in Markdown ```mermaid code fences, reformatting works inside the fence.

Code Style settings

Each supported diagram type has its own page under Settings > Editor > Code Style > Mermaid. The pages share the same general controls (indent size, tab vs. space, base indent below the diagram-type keyword) and add per-language options where they’re useful (e.g. flowchart’s multiline-string alignment, mindmap’s ::icon / :::class line splitting).

Default base indent

As of 2026.2.4, the default base indent is 1 level below the diagram-type keyword across the major formatters. Content sits one indent level inside the diagram body, matching the canonical layout used in upstream Mermaid documentation:

flowchart LR
    A --> B
    B --> C

If you prefer the previous flush-left layout, set the Base indent to 0 for the language under Code Style > Mermaid > (language). The setting is per-language, so you can keep flowcharts indented and class diagrams flush-left if you like.

After upgrading from 2026.2.3 or earlier, running Reformat Code on existing diagrams will indent their content by one level. Adjust the per-language base indent before reformatting if you want to preserve the existing layout.

Supported diagram types

The following diagram types have a dedicated formatter:

• Architecture
• Block
• C4
• Class Diagram
• ER Diagram
• Flowchart
• Gantt
• GitGraph
• Ishikawa
• Mindmap
• Requirement
• Sequence
• Timeline
• Treemap
• XY Chart

Other diagram types fall back to a no-op formatter that preserves the existing layout.