Choose the right diagram type
Learn what each diagram type communicates, when to use it, and how Beauty Diagram turns the source into a cleaner rendered result.
Mermaid Flowchart Syntax & Examples
A syntax reference for Mermaid's flowchart grammar — read this when you need to know the exact way to express a decision, loop, subgraph, or styled edge, then try the result in the editor.
Mermaid Sequence Diagram Syntax & Examples
A syntax reference for Mermaid's `sequenceDiagram` grammar — read this when you need the exact way to write a return arrow, an alt block, an activation, or a note, then try the result in the editor.
Mermaid Gantt Chart Syntax & Examples
A syntax reference for Mermaid's `gantt` grammar — read this when you need to know the exact way to declare a section, dependency, milestone, or excluded date range, then render the result in the editor.
Mermaid Mindmap Syntax & Examples
A syntax reference for Mermaid's `mindmap` grammar — read this when you need to know how indentation maps to hierarchy, how to pick a root shape, or how to add icons, then try the result in the editor.
PlantUML Activity Diagram Syntax & Examples
A syntax reference for the PlantUML activity-beta grammar — read this when you need to know exactly how a particular construct (decision, loop, lane, fork) is written, then beautify or edit the source in the editor.
PlantUML Swimlane Syntax & Examples
A syntax reference for PlantUML's swimlane lane syntax inside activity-beta diagrams — read this when you need to know how to declare a lane, tint it, or re-enter it later, then try the result in the editor.
Mermaid Class Diagram Syntax & Examples
A syntax reference for Mermaid's `classDiagram` grammar — read this when you need the exact notation for a relationship arrow, visibility modifier, or annotation, then try the result in the editor.
Mermaid State Diagram Syntax & Examples
A syntax reference for Mermaid's `stateDiagram-v2` grammar — read this when you need the exact way to express a transition, a composite state, a choice, or a parallel region, then try the result in the editor.
Mermaid ER Diagram Syntax & Examples
A syntax reference for Mermaid's `erDiagram` grammar — read this when you need the exact cardinality notation, attribute syntax, or relationship label format, then try the result in the editor.
Mermaid Pie Chart Syntax & Examples
A syntax reference for Mermaid's `pie` chart grammar — read this when you need the exact way to declare a title, toggle data display, or format slice values, then try the result in the editor.