Flowchart Maker
Drag-and-drop flowchart nodes — connect with curved arrows.
Flowchart Maker
How was your experience with this tool?
Found a bug? Missing a feature? Tell us — it takes 10 seconds.
See how it works
Watch a quick simulation of this tool in action — no file needed.
How to use Flowchart Maker
Follow these steps — everything happens instantly in your browser.
- 1
Step 1. Add process, decision, start/end or I/O nodes.
- 2
Step 2. Drag nodes to position them.
- 3
Step 3. Click 'Link from' then click a target to connect.
- 4
Step 4. Edit labels and export as JSON.
Flowchart Maker: Drag-and-Drop Diagrams with Curved Arrows
Why this matters
Mapping out a process before implementing it is one of the highest-leverage activities in software development, business operations, and education. A flowchart forces you to identify every decision point, every branch, and every terminal state before a single line of code is written or a single workflow is deployed. The problem with most flowchart tools is that they are either too simple (basic boxes and lines with no structure) or too complex (full diagramming suites with a thirty-minute learning curve and a subscription fee). This tool lands in the middle: enough node types and connection mechanics to express real processes, simple enough to use without a tutorial.
The maker provides four node shapes following standard flowchart conventions: pill-shaped nodes for start and end points, rectangles for process steps, diamonds for decision branches, and rounded rectangles for input and output operations. You add nodes from a toolbar, drag them into position on a grid, and then click Link From on a source node followed by clicking the target to draw a curved arrow between them. Decision branches can be labeled Yes or No, and the entire diagram exports as structured JSON so you can save, version, or programmatically manipulate your flowcharts.
Node types and conventions
| Shape | Flowchart meaning | Typical label |
| --- | --- |
| Pill | Start / End | Start, End, Exit |
| Rectangle | Process step | Calculate total, Send email |
| Diamond | Decision | Is valid?, Approved? |
| Rounded rect | Input / Output | User input, Display result |
How to use it
Select a node type from the toolbar: process, decision, start/end, or I/O.
Drag the node to your desired position on the grid canvas.
Click Link From on the source node, then click the target node to create a curved arrow connection.
Double-click any node to edit its label text.
Click Export to download the entire diagram as a structured JSON file.
Testing your result
After building your flowchart, trace every path from the start node to each end node to verify there are no dead ends or unreachable states. Check that every diamond decision node has at least two outgoing connections (typically Yes and No). Verify that the JSON export contains all your nodes and edges by opening it in a text editor — the structure should list every node with its position and label, plus every edge with its source and target references. If you reload the page, the diagram resets because the tool does not persist state to local storage in the current version, so export your JSON before navigating away.
Common mistakes
Creating diamond decision nodes without connecting both the Yes and No branches, leaving an incomplete path.
Overcrowding the canvas with too many nodes before organizing the layout — start with a rough sketch and refine positions after all nodes exist.
Forgetting to export the JSON before refreshing or navigating away, since the diagram is not auto-saved.
Edge cases and limitations
Per-edge deletion is not supported in the current version — deleting a source or target node removes all connected edges automatically, but you cannot remove a single edge while keeping both nodes. The tool does not support loops (an edge from a node back to itself) or cross-page connectors for very large diagrams. Touch devices can drag nodes via the toolbar but may have less precision than mouse-based positioning. The JSON export is human-readable but there is no import function yet, so you cannot reload a previously exported diagram into the editor.
Real-world use cases
A product manager mapping a user onboarding flow with decision branches for different signup methods.
A developer diagramming an error-handling pipeline before implementing try-catch logic in code.
A teacher creating a decision-tree flowchart for a science lab procedure that students can follow step by step.
Frequently asked questions
Q: What node shapes are available?
A: Pill (start/end), rectangle (process), diamond (decision) and rounded (I/O) — each follows standard flowchart conventions.
Q: How do I delete an edge?
A: Delete the source or target node and the edge disappears automatically. Per-edge deletion is not supported in this version.
Q: Can I label edges?
A: Yes — decision branches often need Yes/No labels. The tool auto-shows them when present in the data model.
Q: Is it touch-friendly?
A: Drag works on touch devices; node creation uses the toolbar buttons.
Q: Can I save my diagram?
A: Export as JSON to save your work. There is no auto-save or import function in the current version, so keep your JSON file.
Start using it now
Build process diagrams and decision trees with the Flowchart Maker. For other visual thinking tools, try the Mind Map Maker or the Org Chart Maker. Plan project timelines with the Gantt Chart Maker or analyze strategy with SWOT Analysis.
Want the extended step-by-step tutorial? Read it here.
Why use this tool
Private by design
All processing happens locally in your browser. Open DevTools → Network and you'll see zero file uploads. Ever.
Instant
No upload wait, no queue, no server round-trip. Results appear the moment you drop a file.
Free & unlimited
No accounts, no watermarks, no daily caps. Use it as many times as you like, forever.
Works everywhere
Desktop, tablet or phone — every tool is responsive and installable as a PWA for offline use.
Frequently asked questions
Everything you might want to know about flowchart maker.
❤️ This tool is free — forever.
Sharing it helps more people discover it, and ad revenue from visitors is what keeps it free. No accounts, no catch.
Mind Map Maker
Branch ideas from a central topic — drag, recolor, export.
Org Chart Maker
Build an organizational hierarchy with reports and re-parenting.
Gantt Chart Maker
Plan projects on a draggable timeline — export as JSON.
SWOT Analysis
Map Strengths, Weaknesses, Opportunities and Threats — export MD/JSON.