Search...Search plugins and themes...
⌘K
Sign in
  • Get started
  • Download
  • Pricing
  • Enterprise
  • Account
  • Obsidian
  • Overview
  • Sync
  • Publish
  • Canvas
  • Mobile
  • Web Clipper
  • CLI
  • Learn
  • Help
  • Developers
  • Changelog
  • About
  • Roadmap
  • Blog
  • Resources
  • System status
  • License overview
  • Terms of service
  • Privacy policy
  • Security
  • Community
  • Plugins
  • Themes
  • Discord
  • Forum / 中文论坛
  • Merch store
  • Brand guidelines
Follow us
DiscordTwitterBlueskyThreadsMastodonYouTubeGitHub
© 2026 Obsidian

draw.io

somesanitysomesanity31k downloads

Create and edit diagrams with draw.io (diagrams.net), locally and offline.

Add to Obsidian
  • Overview
  • Scorecard
  • Updates10

demo

🚀 Features

  • 🧩 Interactivity – bind your note links to shapes, add external links, and insert markdown fragments!
  • 🛜 Works 100% offline – No internet required!
  • 🔐 Privacy-first – Runs a local server on your machine.
  • 📐 Mermaid & LaTeX - the draw.io native support Mermaid and LaTeX.
  • 🖼️ Support Canvas - Use diagram in Canvas, linking notes, add external links!

✨ Interactive diagrams

docs/demo.gif

🖇️ Linking shapes with notes & external links

To link your notes or external resources to shapes, right-click on a shape in the editor and select Add link. Then, insert the link to your note or external resource.

🔗 linking notes demo:

docs/demo.gif

🌐 creating an external link demo:

docs/demo.gif

📄 Markdown fragments

Markdown fragments are pieces of markdown that you can add to diagrams.

Right-click on the shape or element you want to bind a markdown fragment to, then select Add data....
The data name should follow the pattern md-number, for example: md-1, md-2.
Next, insert the markdown text into the property.

📜 Adding a markdown fragment demo:

docs/demo.gif

You can literally put anything into a diagram that Obsidian is capable of rendering, including rendering features added by plugins.

for example:

  • random note random-note-demo.gif
  • complex dataviewjs scripts complex-interactive-demo

📐 Mermaid & LaTeX

You can use mermaid, plumt and LaTeX (native support draw.io)

docs/LaTeX&mermaid.gif

🖼️ Canvas support

Use the diagrams in canvas! Link your notes, add external/internal links and markdown-fragments!

canvas-demo.gif

❓ How It Works

This plugin launches a local web server that serves the Draw.io web app directly from your machine.

  • When you open your Obsidian vault and enable the plugin, it spins up the server automatically.
  • You can then create, edit, and save diagrams directly within Obsidian — completely offline.

📦 Installation Guide

there are 2 ways:

  1. install from the plugin page

    after downloading enable plugin, then go to settings, scroll down and click on the downlaod button draw.io client

  2. manually install

  3. after downloadingб

🙌 manually install

  1. downlaod from Releases

    • main.js
    • manifest.json
    • style.css
  2. create Folder in the .obsidian folder (where other plugin) and then move the file to the folder.

    .obsidian/
    └── plugins/
        └── draw-io/
            ├── manifest.json
            ├── main.js
            ├── styles.css
    
  3. enable plugin, then go to settings, scroll down and click on the downlaod button draw.io client

installation-drawio-client-demo.gif

License

This software is licensed under the GNU GPLv3.

78%
HealthExcellent
ReviewCaution
About
Create and edit draw.io diagrams directly inside Obsidian using a local offline web server. Link shapes to notes and external URLs, attach markdown fragments, and add Mermaid or LaTeX content. Insert interactive diagrams into Canvas and export them to PDF.
DrawingIntegrationsVisualization
Details
Current version
3.1.0
Last updated
Yesterday
Created
Last year
Updates
10 releases
Downloads
31k
Compatible with
Obsidian 1.7.2+
Platforms
Desktop only
License
GPL-3.0
Report bugRequest featureReport plugin
Author
somesanitysomesanitysomesanity
GitHubsomesanity
  1. Community
  2. Plugins
  3. Drawing
  4. draw.io

Related plugins

Excalidraw

Visual PKM powerhouse. Create and edit Excalidraw drawings.

Mermaid Tools

Improved Mermaid.js experience: visual toolbar with common elements and more.

Maps

Adds a map layout to bases so you can display notes as an interactive map view.

Kroki

Render Kroki diagrams.

AnyBlock

Take any fragment as a block and render it into multiple effects.

Advanced Canvas

Supercharge your canvas experience. Create presentations, flowcharts and more.

BRAT

Easily install a beta version of a plugin for testing.

Local REST API with MCP

Unlock your automation needs by interacting with your notes over a secure REST API.

Breadcrumbs

Visualise the hierarchy of your vault using a breadcrumb trail or matrix view.

Fast Note Sync

Real-time sync of your vaults across server, mobile, and web; shareable with anyone; supports REST and MCP integrations to build your personal AI knowledge base.