A curated list of bpmn.io related projects and resources. Created in the spirit of awesome.

Contents

• Learning Resources
• Libraries
• Extensions
• Integrations
• Apps
• Talks

Learning Resources

• bpmn-js-examples - Large list of bpmn-js usage examples
• dmn-js-examples - Set of dmn-js usage examples
• form-js-examples - A collection of form-js examples
• bpmn-js walkthrough - An overview over bpmn-js, usage scenarios and its underlying architecture
• bpmn.io demo - A getting started playground into the bpmn-io toolkit
• bpmn.io community forum - A friendly place to ask about all things related to our project

Libraries

Core

• bpmn-js - BPMN 2.0 process and collaboration diagram renderer/editor
• cmmn-js - CMMN 1.2 case diagram renderer/editor
• dmn-js - DMN DRD, decision table and literal expression renderer/editor
• form-js - View and visually edit JSON-based forms

Community Maintained

• chor-js - BPMN 2.0 choreography diagram renderer/editor

Infrastructure / Foundation

• bpmn-moddle - Read, modify and write BPMN 2.0 diagrams from JavaScript
• dmn-moddle - Read, modify and write DMN 1.3 diagrams from JavaScript
• diagram-js - A toolbox for displaying and modifying diagrams on the web

Extensions

diagram-js

• diagram-js-origin - Render a canvas origin cross
• diagram-js-minimap - Render a minimap of your diagram
• diagram-js-direct-editing - A direct editing box for diagram-js

bpmn-js

• bpmn-js-signavio-compat - Expand and collapse sub-processes exported by Signavio
• bpmn-js-token-simulation - Simulate tokens running through your process
• bpmn-js-sketchy - A sketchy renderer for BPMN diagrams
• bpmn-js-nyan - An extension that adds custom resize rules, theming and colors
• bpmn-js-embedded-comments - Add, edit, and persist comments on BPMN diagrams
• bpmn-js-cli - Model diagrams without the mouse
• bpmn-js-copy-paste-example - An example illustrating how to copy and paste BPMN diagram elements across browser tabs
• camunda-transaction-boundaries - Visualize transaction boundaries, applied by the Camunda workflow engine
• bpmn-js-honkify - Integrates honkify inspired duck sounds into bpmn-js
• bpmn-js-task-resize - An extension to allow tasks being resizable
• bpmn-js-disable-collapsed-subprocess - An extension which disables modeling collapsed subprocess via replace menu
• bpmn-js-collapse-subprocess - An extension that re-enables to collapse sub process via replace menu
• bpmn-js-color-picker - Color your BPMN elements via the context pad

Misc

• @bpmn-io/add-exporter - A helper to inject exporter meta-data into saved BPMN, CMMN and DMN diagrams
• @bpmn-io/align-to-origin - Aligns your diagrams to the coordinate origin, manually triggered or on diagram save
• bpmn-js-differ - A semantic diff tool for BPMN diagrams
• bpmn-to-image - Transform BPMN diagrams to images from the command line
• bpmn-js-i18n - Internationalization resources for bpmn-js
• bpmn-font - A BPMN 2.0 icon font
• bpmnlint - An extensible and configurable BPMN 2.0 diagram validator
• eslint-plugin-bpmn-io - Common lint rules for bpmn.io projects
• dmnlint - Validate DMN diagrams based on configurable lint rules
• dmn-migrate - Migrate your DMN diagrams to the latest DMN version

Integrations

• react-bpmn - Render BPMN 2.0 diagrams in a React application
• vue-bpmn - Render BPMN 2.0 diagrams in a Vue.js application
• bpmn-js-example-angular - An integration of bpmn-js with Angular
• svelte-bpmn - Render BPMN 2.0 diagrams in a Svelte application
• jupyterlab-bpmn - Render BPMN 2.0 diagrams in JupyterLab
• jupyterlab-dmn - Render DMN diagrams in JupyterLab

Apps

• Cawemo - A web-based, collaborative modeling solution that uses bpmn-js for process modeling
• Camunda Modeler - The Camunda Automation Platform and Camunda Cloud implementation tool and an integrated modeling solution for BPMN, DMN and CMMN based on bpmn.io
• bpmn-io-vs-code - Display and edit BPMN diagrams in VS Code using bpmn.io tools
• postit-js - Create Post-it boards on a canvas editor
• Duckflow - Lightweight BPMN process designer application, based on bpmn.io
• bpmn-diff-bitbucket-plugin - Bitbucket Server plugin for BPMN file versions visual comparison during pull-requests
• Cammand - alternative UI for Camunda Platform. Check out for bpmn-js embedded in Blazor (C#).

Talks

• Roll your own BPMN editor - An introduction to bpmn-js and its friends
• Making of token simulation - A dive into bpmn-js extensibility and the inner workings of bpmn-js-token-simulation
• Taking Templates to the limit - A hands-on demo on how to create Element Templates in your favorite IDE with JSON Schema

Contribute

Would you like to contribute to this list? Propose your addition.

License