# Diagram-as-code playground — any engine, no upload

> A free-form diagram-as-code playground: edit any Mermaid diagram or Graphviz DOT graph, switch engines, preview live, and export — all on-device, nothing uploaded.

A free-form canvas for any Mermaid diagram or Graphviz DOT graph: switch engines, edit live, and export. It's the whole desk in one place, running on-device with nothing uploaded.

The playground is the desk without guardrails: one editor, both engines, any diagram type. It's ideal when you're not sure which diagram fits yet, or when you have some Mermaid or DOT from elsewhere and just want to render and tweak it quickly.

Switching engines in place is the real convenience — some graphs read better in Graphviz's layout, others are faster to express in Mermaid, and here you can try both against the same idea before committing.

When you know the shape you want, the focused tools — Flowchart, Sequence diagram, ER diagram, Gantt chart — start you with the right template.

## How to

1. **Pick an engine.** Choose Mermaid or Graphviz (DOT).
2. **Write or paste.** Enter any diagram source, or paste an existing one.
3. **Preview live.** See it render as you edit, and switch engines to compare.
4. **Export.** Download SVG, PNG, or PDF.

## FAQ

### What can I build in the playground?

Anything the two engines support — Mermaid flowcharts, sequence, state, class, ER, mindmap, and gantt, or Graphviz DOT graphs — all in one flexible editor.

### Can I switch engines without losing work?

You can toggle between Mermaid and Graphviz to try the same idea in each; it's the fastest way to see which engine renders your graph best.

### Is it good for pasting diagrams from elsewhere?

Yes. Paste Mermaid or DOT you already have to preview, tweak, and export it without setting up any local tooling.

### Is my diagram source uploaded?

No. All rendering happens in your browser, so whatever you paste or write stays on your device.


## Related tools

- [Flowchart](https://www.safepaper.app/diagram/flowchart)
- [Graphviz (DOT)](https://www.safepaper.app/diagram/graphviz)
- [ER diagram](https://www.safepaper.app/diagram/er-diagram)
- [Gantt chart](https://www.safepaper.app/diagram/gantt-chart)

---

Canonical HTML: https://www.safepaper.app/diagram/playground
Markdown: https://www.safepaper.app/diagram/playground.md

There is no upload endpoint — your files are processed in this browser tab. Open your network tab and check.