DIAGRAM
+ New diagram
Rename diagram
Delete diagram
File
Open file…
Save JSON
Save .mmd
PNG
SVG
Tools
Duplicate selection
Delete selection
Arrange
Layout left to right
Layout top to bottom
Zoom in +
Zoom out −
Style
Mermaid theme
Default
Dark
Forest
Neutral
Base
Line color
Label color
Label background
Label weight
400
500
600
700
Mermaid
Visual
Loading Mermaid…
Zoom 100%
Add node
Name
Group (optional)
Shape
Box
Ellipse
Circle
Database
Text
Diamond
Cancel
Add node
Controls and shortcuts
Everything from the original Vis Network module, without WordPress.
Drag a node:
move it freely. Drag blank canvas to pan. Mouse wheel to zoom.
Ctrl or Cmd plus click:
select multiple nodes.
Right drag:
select all nodes inside a rectangle.
Click a node or edge:
edit properties in the sidebar.
Double click a node:
select its connected nodes.
Select two nodes, then Connect:
add or remove their relation. Select one node, then Connect to pick a target.
Right click:
context menu to edit, connect, duplicate or delete.
Ctrl+C
or
Cmd+C
copy,
Ctrl+V
or
Cmd+V
paste,
Ctrl+D
or
Cmd+D
duplicate,
Delete
delete selection.
Ctrl+Z
or
Cmd+Z
undo,
Ctrl+Y
or
Cmd+Y
redo. Search finds and focuses nodes.
Group filters:
toggle visibility. Layout buttons arrange once, then release nodes for manual placement.
Multiple diagrams:
put two independent erDiagram, classDiagram, or flowchart blocks in the source (optionally title each with %% diagram: Name). Mermaid displays both; Visual shows two separate networks in one canvas. Use NETWORKS buttons to focus a network. JSON preserves both graphs and positions; Mermaid editing stays separate.
Close