Tree diagram generator
Turn any hierarchy into a clean tree. Type parent-and-child lines in Mermaid — or a plain indented outline — and render family trees, decision trees, org charts and sitemaps on your device.
One step per line. Indent two spaces to branch beneath the line above.
The fastest tree is an indented list
A tree diagram is pure hierarchy, and hierarchy is exactly what indentation encodes. Switch on Outline mode and type one item per line, indenting children two spaces under their parent — the converter turns the list into a rendered tree instantly, with no syntax to learn. It is deterministic and runs on your device, so it stays free and private.
When you want diamond shapes, branch labels or a different layout direction, toggle back to Mermaid: the generated source stays right there to edit.
One structure, many trees
What makes a diagram a tree: one root, every node has exactly one parent, and no cycles. That single constraint covers a family descent chart, an org chart, a decision tree, a website sitemap, a folder structure and a category taxonomy — the examples above are the same structure wearing different labels.
For decision trees, use diamond nodes for questions and label each branch with the answer. For family and org trees, plain boxes with names read best — and treating a couple as one node keeps a descent chart legible.
Top-down or left-to-right
graph TD grows downward and suits wide, shallow trees like org charts; graph LR grows rightward and keeps deep, narrow trees — long decision chains, folder structures — on screen without shrinking. Switching direction is a one-word edit and the layout engine reflows everything.
When the shape is right, export a vector SVG or a PNG for slides, or copy the Mermaid source into a README or wiki where it renders natively.
Diagram types
Frequently asked questions
How do I make a tree diagram from text?
Either write Mermaid parent-child lines like "A --> B" under "graph TD", or switch on Outline mode and type an indented list — each line becomes a node and each indent a branch. The tree renders live and exports to SVG or PNG.
Can I make a family tree?
Yes — model descent by making each generation a level, and treat a couple as a single node like "Robert & Susan" with children branching below. Mermaid has no genealogy-specific marriage lines, so this works best as a readable descent chart rather than a full genealogical record.
How do I build a decision tree?
Use diamond nodes for questions, like Q{"Need a custom feature?"}, and label each outgoing branch with the answer using -->|Yes| or -->|No|. Leaves are the outcomes. For probability trees, put the probability in the branch label instead.
Should I use TD or LR?
Top-down (TD) for wide, shallow hierarchies such as org charts; left-to-right (LR) for deep chains such as decision sequences or folder paths. It is a one-word change at the top of the diagram.
Is it free, and is anything uploaded?
Completely free — no signup, no watermark — and the tree renders in your browser, so names, org structures and plans never leave your device.