Mind Map / Thought Web Organizer

How to use this tool

1. Drag nodes to reposition them on the canvas.
2. Double-click a node to edit its text.
3. Select a node and use the toolbar or Tab and Enter shortcuts to add child and sibling nodes.
4. Use Delete or Backspace, or the toolbar Delete button, to remove a selected non-root subtree.
5. Export a PNG or JSON backup, and import a validated JSON map after confirming replacement.

What is a mind map?

A mind map is a visual diagram that organizes information hierarchically around a central concept. Branches radiate outward representing related subtopics, and sub-branches expand further. The structure mirrors how the brain naturally associates ideas, making mind maps effective for brainstorming, note-taking, project planning, and studying.

How to build an effective mind map

1. Start with the central idea: place your main topic in the center node. Use a keyword or short phrase, not a full sentence.
2. Add main branches: create 4–8 primary branches for the major categories or themes related to your central topic.
3. Expand with sub-branches: each primary branch can have its own sub-branches for more detail. Aim for 2–4 levels of depth maximum.
4. Use single keywords: the most effective mind maps use one or two keywords per node rather than phrases, which encourages broader association.
5. Use color as a visual cue: new nodes receive colors from an automatic palette. This tool does not provide a manual branch-color control, so use concise labels and the tree structure to distinguish categories.

When to use a mind map

• Brainstorming: ideal for generating ideas without committing to structure. The spatial layout avoids the sequential ordering constraint of a numbered list.
• Note-taking: capturing a lecture or book where the hierarchy is clear but bullet points feel too linear.
• Project planning: breaking down a goal into areas, tasks, and sub-tasks visually before moving to a linear to-do list.

Mind maps are less suited to tracking sequential tasks (use a to-do list), weighing options systematically (use a decision matrix), or showing causal relationships (use a flowchart or concept map).

Mind map vs concept map

Mind maps (popularized by Tony Buzan in the 1970s) are hierarchical: one central idea with branches radiating outward. Every node has exactly one parent. Concept maps are cross-linked: nodes can connect to multiple other nodes, and relationships are labeled on the connecting lines. Concept maps are better for showing complex webs of relationships; mind maps are faster to create and easier to scan.

Keyboard shortcuts

• Tab: add a child to the selected node.
• Enter: add a sibling under the same parent; on the central Main Idea node, add a child.
• Delete / Backspace: remove the selected non-root node and its descendants. The central root cannot be deleted.
• Ctrl/Cmd+Z: undo the last map change.
• Ctrl/Cmd+Shift+Z or Ctrl+Y: redo an undone map change.

Focus a node by clicking or tabbing to it before using these shortcuts. While editing a label, Enter and Escape both save the text; Tab keeps its normal focus behavior and does not add a node. Undo history stores up to 50 map changes. New nodes use an automatic color palette, and individual colors cannot be changed in the editor.

Save, import, and export

The current map is saved automatically in this browser's localStorage and restored when you return. Export JSON to keep a backup in the same {nodes:[...]} data shape, or download a PNG image rendered locally from the SVG map. PNG, JSON export, and JSON import are disabled while a node label is being edited so the in-progress input cannot be omitted.

JSON import reads the selected file in the browser and asks before replacing the current map. It accepts files up to 1 MB and maps with at most 500 nodes, unique IDs, valid parent links, finite coordinates within 10,000 units, text up to 1,000 characters, and six-digit hexadecimal colors. Invalid files leave the current map unchanged. Map text stays on this device: file actions do not upload it to a server.

The toolbar's + Root Node control creates an independent top-level idea with no connecting edge. To add a connected branch to the central topic, select Main Idea and use Tab, Enter, or the child button. Dragging currently uses a mouse; the editor does not include zoom, pan, automatic layout, collapse, or a manual color picker.