Flowchart Maker
⚠️ Pressing this builds the chart again from the text on the left.
This browser is not allowing storage (a private window, perhaps). Drawing and exporting still work.
Rules for writing it out
- One line, one box. They follow each other in the order you write them.
- A line ending in a question mark splits. The lines indented under it are the branches.
- The next line after the branches is where they meet again.
Wrap a line in brackets for a start or end shape, and put ‘yes:’ in front to name an arrow.
Page 1280 × 896 — The dashed line is the page edge. Drag its bottom-right corner to resize. Copying as an image and saving as SVG trim to the drawing itself; anything past the page edge is left out.
Double-click a box (or press F2) to edit its text in place. Drag to move; select one and drag a corner to resize. Drag on blank canvas to select several, then use Align and Spacing above. Ctrl+C and Ctrl+V copy, Delete removes.
PNG blurs when enlarged. Save as SVG for slides — PowerPoint converts it to editable shapes.
The background for “Copy image” and for a saved PNG. If the program you paste into does not support transparency it may come out black — choose White, or save as SVG. (Printing uses the colour of the paper.)
How to use
- Pick a shape under Add element — rectangle, rounded, start/end, diamond for a decision, ellipse, star or a plain text box — and it is placed on the canvas.
- Double-click a box, or press F2, to type its text.
- Switch to Connect and drag a line across empty space: the boxes at each end are joined. Switch back to Select to move things again.
- Select a box to change its fill, border and text. Select several to line them up or space them evenly.
- Copy as image for a slide, Save SVG to keep it editable, or Save locally to keep it in this browser.
Worth knowing
- Everything happens in this browser. Nothing is uploaded, and closing the tab loses whatever you have not saved.
- Saved charts live in this browser's storage, so they are not on your other machines. Save to file to move one.
- SVG keeps the text as text, so it stays sharp at any size and can still be edited. A copied image is a fixed picture.
- There is also a Show text panel that draws a whole chart from an outline. Running it again rebuilds every box from that text, so anything you moved by hand goes back — move boxes after the last time you use it.