Help us improve
Share bugs, ideas, or general feedback.
From pactkit
Generates Draw.io XML diagrams for system architectures (top-down), dataflows (left-right), and deployments (grouped) using predefined enterprise styles. Outputs editable .drawio files.
npx claudepluginhub pactkit/claude-code-plugin --plugin pactkitHow this skill is triggered — by the user, by Claude, or both
Slash command
/pactkit:pactkit-drawThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Generate system architecture diagrams using Draw.io XML.
Reference for generating valid draw.io XML diagrams programmatically, including mxGraphModel structure, cell types, style properties, and validation rules for .drawio files.
Generates .drawio architecture diagrams with consistent styles for containers, capabilities, external services, processes, and outcomes. Includes legend and exports to PNG/SVG/PDF/HTML.
Generates and validates draw.io XML diagrams enforcing 23 strict quality rules for structure, styles, fonts, edges, and layout. CLI validator for flowcharts, architecture, and sequence diagrams.
Share bugs, ideas, or general feedback.
Generate system architecture diagrams using Draw.io XML.
Copy these style strings exactly — do NOT improvise styles:
| Role | Style String |
|---|---|
| Input | rounded=1;whiteSpace=wrap;html=1;fillColor=#d5e8d4;strokeColor=#82b366; |
| Process | rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf; |
| Decision | rhombus;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656; |
| Output | rounded=1;whiteSpace=wrap;html=1;fillColor=#f8cecc;strokeColor=#b85450; |
| Storage | shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;backgroundOutline=1;size=15;fillColor=#e1d5e7;strokeColor=#9673a6; |
| Container | swimlane;whiteSpace=wrap;html=1;container=1;collapsible=0;recursiveResize=0;fillColor=#f5f5f5;strokeColor=#666666; |
| External | rounded=1;whiteSpace=wrap;html=1;dashed=1;fillColor=#ffe6cc;strokeColor=#d79b00; |
| Edge | edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1; |
<mxfile host="app.diagrams.net" type="device">
<diagram name="Page-1" id="diag_1">
<mxGraphModel dx="1000" dy="600" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100">
<root>
<mxCell id="0"/>
<mxCell id="1" parent="0"/>
<!-- NODES HERE: id="n_1", id="n_2", ... -->
<!-- EDGES HERE: id="e_1", id="e_2", ... -->
</root>
</mxGraphModel>
</diagram>
</mxfile>
<mxCell id="n_1" value="Label" style="STYLE_STRING" vertex="1" parent="1">
<mxGeometry x="100" y="100" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="e_1" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1" source="n_1" target="n_2">
<mxGeometry relative="1" as="geometry"/>
</mxCell>
.drawio filehtml=1; (already in dictionary)id MUST be unique: n_ prefix for nodes, e_ for edges, c_ for containerssource and target MUST reference existing node IDsparent="c_1" (container ID), not parent="1"IF open_drawio_xml tool available:
.drawio fileopen_drawio_xml with XML content for instant previewopen_drawio_mermaid to open existing .mmd files in Draw.ioIF MCP tools NOT available: