Vloam Mermaid

Docs

Mermaid guides for this studio

Learn the diagram types this editor uses most. Short pages, clear examples, then open the live preview.

  1. Start here with MermaidLearn what Mermaid is, how this editor works, and draw your first small diagram in minutes.
  2. Mermaid flowchart basicsBuild top-down or left-right flowcharts with boxes, decisions, labeled arrows, and short readable labels.
  3. Sequence diagramsShow who sends messages to whom with participants, sync and async arrows, and short notes.
  4. Class diagramsSketch types, fields, methods, and relationships with a small, readable class diagram.
  5. State diagramsModel life cycles with states, events, and clear start and end markers.
  6. Fix common errorsRepair the Mermaid mistakes that break the preview most often in this editor.