Skip to content
Limited Time 30% off Mermaid Studio — Get discount →

Code Folding

Last updated:

Large diagrams can be difficult to navigate. Code folding lets you collapse sections of your diagram to focus on what matters.

Look for the icon in the editor gutter. Click it to collapse that section.

To expand a collapsed section, click the icon that appears in its place.

  • Collapse current section: Ctrl+NumPad- (Windows/Linux) or Cmd+NumPad- (macOS)
  • Expand current section: Ctrl+NumPad+ (Windows/Linux) or Cmd+NumPad+ (macOS)
  • Collapse all: Ctrl+Shift+NumPad- (Windows/Linux) or Cmd+Shift+NumPad- (macOS)
  • Expand all: Ctrl+Shift+NumPad+ (Windows/Linux) or Cmd+Shift+NumPad+ (macOS)

Different diagram types have different foldable sections:

  • Flowcharts - Subgraphs
  • ER Diagrams - Entity blocks
  • State Diagrams - State blocks and composite states
  • Class Diagrams - Class definitions
  • Sequence Diagrams - Loop, alt, opt, and other blocks
  • Gantt Charts - Sections