Your diagrams are made here, and stay here.

Most online diagram tools send your text to a server to draw it. This one is built so that the page is not allowed to. Three ways to confirm that.

The browser enforces it

The page ships with a Content Security Policy that forbids every outgoing connection. The browser itself refuses to let the page open connections to other servers, so the page has no way to upload your diagram text.

connect-src 'none'
form-action 'none'

Pull the plug

Open the editor, switch off your Wi-Fi and keep drawing. Rendering, editing and exporting all run on your device. Open each format once before going offline, so its renderer is loaded.

Read the code

The code of the page is plain, readable JavaScript: open your browser's developer tools or “view source” and see for yourself. All libraries ship with the page. No fonts, analytics or ads are loaded from other sites.

Pick a format, write, and the preview follows every keystroke.

flowchart LR
  A[Idea] --> B{Ready?}
  B -->|yes| C[Ship]

@startuml
User -> App : text
App --> User : SVG
@enduml

digraph G {
  Editor -> Renderer;
  Renderer -> SVG;
}

part def Vehicle {
  part engine : Engine;
}
part def Car :> Vehicle;

<mxCell value="Start"
  style="ellipse;"
  vertex="1">

SysML v2 covers a practical subset of the textual notation: structure, action flows, state machines and use cases. The draw.io preview is simplified: shapes, colours, labels and arrows are drawn, the editing itself stays in draw.io. Planned: tabs.

Mermaid, PlantUML, Graphviz, draw.io and SysML are names of their respective owners. Graph Manufacture is an independent project and is not affiliated with, endorsed by or sponsored by them.

Change the format in the editor and your diagram is converted on the spot. Formats never match exactly, so nothing is dropped silently: every line that could not be carried over is listed with its line number and the reason. Go straight back and your original text returns unchanged.

@startuml
skinparam monochrome true
actor User
User -> App : open file
== Phase 2 ==
App --> User : preview
@enduml

sequenceDiagram
  actor User
  participant App
  User->>App: open file
  Note over User,App: Phase 2
  App-->>User: preview

“One way” means the result is a graph or a SysML model that you can keep editing, but it cannot be turned back into the original diagram type; switching straight back in the editor restores your original instead. Graphviz and draw.io convert into each other in both directions, and SysML converts to Graphviz and draw.io as a graph. Towards Mermaid and PlantUML a SysML text becomes a class, state, activity or use case diagram, depending on which kind of element it holds most of; the rest is named in the loss list. Flowcharts with decisions or start and end points become SysML action flows. When no direct route exists, the conversion runs in steps and the loss list covers every step. Types without a counterpart (for example Mermaid timelines or pie charts) are refused with an explanation.

Guides: PlantUML to Mermaid · Mermaid to PlantUML · PlantUML to draw.io · Mermaid to draw.io · PlantUML viewer · Mermaid viewer · draw.io viewer

• PreviewUpdates while you type.
• TemplatesReady-made starting points for every format.
• NavigationZoom and pan the preview, drag the divider, keyboard shortcuts.
• TabsSeveral diagrams side by side, each with its own format. Rename, reorder and close them.
• Find and suggestionsSearch the labels in the diagram, and get keywords and snippets in the editor with Ctrl+Space.
• PresentationFullscreen with only the diagram, for showing it to others.
• ExportSVG, PNG, standalone HTML, PDF.
• StorageYour work stays in your browser, tabs included. Open and save .mmd, .puml, .dot, .sysml and .drawio files, or open a Markdown file and edit its diagram blocks in place.
• BackupOne file with all your tabs, and in Chrome and Edge an optional auto-save into a file on your device. Nothing is uploaded.
• AccountNone. No sign-up, no paywall, no tracking cookies.
• PriceFree, MIT licensed.

Start drawing