OneTaskBy Tim King · Updated
Org Chart Maker
Tree Diagram from an Indented List, Free
OneTask is free, with no sign-up, and built by one person.
If this tool saved you time, a coffee helps keep new ones coming.
How the Org Chart Maker works
This org chart maker draws a reporting tree from an indented list. An org chart shows who reports to whom; a tree diagram shows how anything branches, from a folder structure to a family of species. Both are the same drawing: a root at the top, children below, connectors between. Type the hierarchy as an indented list, one name per line with an optional role after a comma, and this page lays it out with tidy spacing, draws boxes or dots and connectors, and lets you download SVG or PNG. Nothing is uploaded.
Org chart maker: writing the list
One person or item per line. Indent by two spaces or one tab for each level down; a line belongs to the nearest line above with less indentation. Anything after a comma or colon is a subtitle, shown under the name in a box or in brackets beside a dot: "Ana Costa, Engineering Manager". Lines starting with "#" are ignored. A single top line becomes the root; several top lines are drawn as separate trees hanging from an unlabelled root, which is handy for a chart with co-leads or for a forest of unrelated trees.
Direction and nodes
Top down puts the root at the top and each level in a row beneath it, the classic org chart. Left to right puts the root at the left with the levels running across, which suits deep trees with many leaves, such as a folder listing or a dendrogram, because the names stack vertically and never overlap. Boxes draws each node as a rounded rectangle with the name and subtitle inside, outlined in the colour of its top-level branch. Dots draws a small coloured circle with the name beside it, which fits far more nodes on the page.
Connectors and layout
Elbow connectors are the right-angled lines of a traditional org chart; Curved connectors give the smooth look of a dendrogram or a decision tree. Tidy tree places each level at an equal distance and packs siblings as close as possible without overlap, the standard Reingold-Tilford layout. Align leaves pushes every leaf to the far edge so the ends line up, the layout used for dendrograms and cluster diagrams, where the depth of a branch has no meaning.
Height and colour
The drawing grows with the tree: a top-down chart gets taller with each level and a left-to-right chart gets taller with each leaf, so a large team never gets squashed. Each top-level branch takes its own colour from the palette and passes it down to everything under it, so the divisions of an organisation are easy to tell apart. Hovering a node shows its full path from the root, which is kept in the downloaded SVG.
Exporting
Download SVG gives a vector file with names as editable text, ready for Inkscape, Illustrator or Figma. Download PNG renders at one, two or three times the preview width. Copy SVG puts the markup on the clipboard. Everything is drawn in your browser; the text never leaves your machine.
FAQ
How do I add job titles?
Put the title after a comma or colon on the same line: "Priya Shah, CEO". In Boxes mode the title appears under the name; in Dots mode it appears in brackets after it. Lines without a comma show just the name.
Can two people share the top?
Yes. Write both at the top level with no indentation and they are drawn side by side under a small unlabelled root. Everyone indented under each of them belongs to their side.
What is the difference between Tidy tree and Align leaves?
Tidy tree keeps every level at the same distance from the root, so depth is readable and the drawing is compact. Align leaves stretches branches so all leaves sit on the same line, which is how dendrograms are drawn; use it when the leaves are the point and the depth is not.
How large a chart can it draw?
Hundreds of nodes lay out instantly. The limit is readability: switch to Left to right and Dots for a deep tree with many leaves, and the page height grows to keep names from overlapping. For a very wide top-down chart, download the SVG and view it at full size.
See also: all Diagram Makers tools, Images, Audio, Video & Screen, PDF, SVG, Simulations & Screensavers, Generative Art, Chart Makers, 3D Model Viewers, Drawing Pads, Mockups & 3D Making, 3D Science, Tracker Music.
Related tools
Treemap Maker
Type an indented list with values and download a treemap as SVG or PNG.
Sunburst Chart Maker
Type an indented list and download a sunburst chart as SVG or PNG.
Checklist Formatter
Convert Markdown checklists to Jira or Slack format.
Indent Code
Shift every line right by a set number of spaces or tabs.
SVG To PNG
Rasterise an SVG to a PNG at any width.