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

BPMN

joleafjoleaf13k downloads

Enable viewing BPMN diagrams using bpmn-js.

Add to Obsidian
  • Overview
  • Scorecard
  • Updates31

This plugin lets you view BPMN diagrams interactively in your Obsidian notes with an bpmn code-block. Furthermore, a BPMN modeler lets you edit your BPMNs directly in Obsidian. The plugin is based on the bpmn-js library.

NEW Feature: Token Simulation!

How to use (CodeBlock)

  1. Add a valid *.bpmn file to your vault
  2. Add the BPMN diagram to your note:
```bpmn
url: [[my-diagram.bpmn]]
```

Parameter

You can customize the view with the following parameters:

Parameter Description Values
url The url of the *.bpmn file (required). Relative/Absolute path, or as "[[*.bpmn]]" markdown link.
height The height of the rendered canvas. [200..1000]
opendiagram Show a link to the *.bpmn file. True/False
showzoom Show the zoom buttons below the canvas. True/False
enablepanzoom Enable pan and zoom. True/False
zoom Set the zoom level. Default is 'fit-viewport'. 0.0 - 10.0
x Set the x coordinate, if a zoom value is set. 0 - ... (default: 0)
y Set the y coordinate, if a zoom value is set. 0 - ... (default: 0)
forcewhitebackground Force a white background. True/False

Example

Example

How to edit the BPMN

Just open the BPMN file in your obsidian vault and the BPMN will be editable in fullscreen mode.

Features

  • Token simulation
  • Update properties
  • Export SVG

Install ..

.. automatically in Obsidian

  1. Go to Community Plugins in your Obsidian Settings and disable Safe Mode
  2. Click on Browse and search for "BPMN"
  3. Click install
  4. Toggle the plugin on in the Community Plugins tab

.. manually from this repo

  1. Download the latest release *.zip file.
  2. Unpack the zip in the .obsidan/plugins folder of your obsidian vault

How to dev

  1. Clone this repo into the plugin folder of a (non-productive) vault (.obsidian/plugins/)
  2. npm i
  3. npm run dev
  4. Toggle the plugin on in the Community Plugins tab

Donate

HealthExcellent
ReviewRisks
About
View BPMN diagrams interactively inside notes using a bpmn code block or linked .bpmn files. Edit diagrams with a built-in modeler, run token simulations, and export diagrams as SVG.
DrawingExportVisualization
Details
Current version
7.4.0
Last updated
2 months ago
Created
4 years ago
Updates
31 releases
Downloads
13k
Compatible with
Obsidian 0.15.0+
Platforms
Desktop, Mobile
License
MIT
Report bugRequest featureReport plugin
Sponsor
Ko-fi
Author
joleafjoleaf
github.com/JoLeaf
GitHubjoleaf
  1. Community
  2. Plugins
  3. Drawing
  4. BPMN

Related plugins

Excalidraw

Visual PKM powerhouse. Create and edit Excalidraw drawings.

Mermaid Tools

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

Kroki

Render Kroki diagrams.

Mermaid View

Handle Mermaid files as first-class citizens, rendering them fullscreen when opened.

Simple mind map

A mind map that combines aesthetics and functionality. 一个颜值与功能并存的思维导图。

draw.io

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

D2

A modern diagram scripting language that turns text to diagrams.

Breadcrumbs

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

Advanced Canvas

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

Maps

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