skills.rest
davistroy
davistroyCOMMUNITY
Explore all skills by this author →
GitHub

bpmn-diagram

Convert BPMN 2.0 XML into PNG diagram images via Node.js.

Updated Aug 23, 2026
Search Tags:#png#visualization#diagram#bpmn#render
One-click install
npx skills add https://github.com/davistroy/bpmn --skill bpmn-diagram
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: bpmn-diagram
Source: https://github.com/davistroy/bpmn/tree/main/.claude/skills/bpmn-diagram
Command: npx skills add https://github.com/davistroy/bpmn --skill bpmn-diagram

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires bpmn-js, jsdom, canvas, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill turns BPMN 2.0 XML into standalone PNG diagram images, enabling quick visualization and sharing of process diagrams without requiring a browser.

Core Features & Use Cases

  • XML-based rendering: Converts BPMN XML (file or inline) into a PNG using the bpmn-js engine in Node.js.
  • Flexible input: Accepts file paths or inline XML content.
  • Use Case: Create on-demand visuals for documentation, reviews, and training materials.

Quick Start

node scripts/render-bpmn.js input.bpmn output.png

Frequently Asked Questions about bpmn-diagram

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert BPMN XML to a PNG diagram?▼

BPMN XML conversion to PNG uses the bpmn-js rendering engine in Node.js. Run `node scripts/render-bpmn.js input.bpmn output.png` to transform your BPMN 2.0 XML file into a standalone PNG image without requiring a browser.

Can I render BPMN diagrams from inline XML content?▼

Yes, the Skill accepts both file paths and inline BPMN XML content as input, so you can pass XML strings directly instead of requiring a separate file.

What BPMN versions and diagram features does this support?▼

This Skill renders BPMN 2.0 XML with support for both simple and complex processes, including optional scale and minimum dimension settings for diagram customization.

Do I need a browser to generate BPMN PNG visualizations?▼

No. The Skill executes rendering entirely in Node.js using bpmn-js, jsdom, and canvas, producing PNG output without any browser dependency.

What are the typical use cases for BPMN diagram visualization?▼

BPMN PNG generation enables on-demand creation of process diagrams for documentation, peer reviews, and training materials, making process flows shareable without specialized tools.

Can I customize the scale and dimensions of rendered BPMN diagrams?▼

Yes, the Skill supports optional scale and minimum dimension parameters, allowing you to adjust the PNG output size and proportions to fit your documentation or display requirements.

Related Skills

Explore More Software Engineering Skills→
StiegesStieges
28

bpmn-generator

Convert natural-language process descriptions into BPMN 2.0 XML and SVG diagrams.

Community
Advanced
codingSamsscodingSamss
11

fireworks-tech-graph

Generate technical diagrams from text prompts with SVG validation and PNG export.

Community
Intermediate
curiositechcuriositech
181

mermaid-graph-renderer

Render Mermaid diagrams into SVG, PNG, and PDF formats.

Official
Advanced
davistroydavistroy
5

bpmn-to-drawio

Convert BPMN 2.0 XML diagrams into Draw.io .drawio format.

Community
Advanced