Markdown in.
Mind map out.

Write an outline the way you already do. Markmap turns it into an interactive map you can fold, zoom, share and export.

Open the editor Read the docs Get it for VS Code

One outline, any shape

Every layout works with every theme, in light and dark.

Tree. The classic mind map, growing to the right.
Two-sided. Branches on both sides of the root.
Org chart. Top-down, for hierarchies and plans.

Built for real documents

Rich labels

Bold, links, code, highlights, task lists, images and math, all drawn on the map.

Notes

Paragraphs, tables and code stay with their branch and open in a popover.

Export anywhere

Clean SVG and PNG that open in any viewer, plus one offline HTML file.

Very large maps

Switch to the canvas renderer to keep thousands of nodes smooth.

Links that carry it all

A share link holds the document and the view, so nothing is stored on a server.

Options in the document

Frontmatter sets the layout and theme, and a comment folds a branch.

Use it where you work

On a web page

One script turns each block into a map as it scrolls into view.

<script type="module"
  src="https://cdn.jsdelivr.net/npm/@markmap/autoloader">
</script>

<div class="markmap" data-theme="cards">
  <script type="text/markdown">
    # Trip
    ## Before
    ## During
  </script>
</div>
Autoloader

In an app

A web component that works with any framework.

import '@markmap/element';

<markmap-view
  src="./notes.md"
  theme="cards"
  layout="two-sided"
  toolbar
></markmap-view>
Web component

From the command line

One offline HTML file, or an image for scripts and CI.

markmap notes.md
markmap notes.md --svg
markmap notes.md --png
Command line