Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>BPMN EditorNew to Visual Studio Code? Get it now.
BPMN Editor

BPMN Editor

Red Hat

redhat.com
|
53,104 installs
| (8) | Free
Edit BPMN files
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

BPMN Editor

vs-code-support github-ci

Create and edit BPMN and BPMN2 files.

Features

  • Create and edit BPMN (.bpmn) and BPMN2 (.bpmn2) files.
  • Native keyboard shortcuts (Press shift+/ to display available combinations).
  • Export diagram to SVG (use the SVG icon on the top-right corner).

Editing a new BPMN file

alt

Settings

Setting Description Default value
kogito.bpmn.runOnSave Execute a command on each save operation of the BPMN file empty
kogito.bpmn.svgFilenameTemplate Filename template to be used when generating SVG files ${fileBasenameNoExtension}-svg.svg
kogito.bpmn.svgFilePath Where to save generated SVG files ${fileDirname}

The kogito.bpmn.svgFilenameTemplate and kogito.bpmn.svgFilePath settings accept the following variables as tokens:

Variable Example
${workspaceFolder} /home/your-username/your-project
${fileDirname} /home/your-username/your-project/folder
${fileExtname} .ext
${fileBasename} file.ext
${fileBasenameNoExtension} file
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft