An automation skill designed to generate draw.io architecture diagrams, flowcharts, and technical schemas with an integrated visual QA pass.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install testskill99
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install testskill99 using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Draw.io Diagrammer Skill?
The drawio-diagrammer-skill enables AI agents to programmatically generate structured draw.io diagrams and export them into high-resolution visual assets. By integrating this capability into Openclaw Skills, developers can automate the creation of technical diagrams while maintaining layout rules and spacing requirements.
This tool supports a variety of diagram types, including database entity-relationship diagrams (ERDs), process flowcharts, sequence diagrams, and system architecture mappings. It removes the manual effort of drafting schemas while ensuring the output remains readable and structured.
Draw.io Diagrammer Skill Use Cases
- Designing database ERDs and mapping out structural entity relationships.
- Creating detailed process flowcharts and organizational workflow diagrams.
- Documenting system architectures, network topologies, or component relationships.
- Generating UML sequence and class diagrams for software engineering design cycles.
- Visualizing complex algorithmic steps and process paths directly from plain text descriptions.
How Draw.io Diagrammer Skill Works
- Diagram Type Detection: The skill identifies the target diagram format (e.g., flowchart, ERD, sequence diagram) before drafting the XML configuration.
- Universal Layout Styling: It applies predefined spacing guidelines to all nodes to prevent overlapping elements and cramped visual layouts.
- Render Generation: The agent runs a local command line export to convert the draft
.drawiofile into a high-scale PNG graphic. - Visual Quality Review: An automated review cycle checks for text overflow, overlapping arrow lines, and spacing collisions.
- Iterative Refinement: If any visual issues are identified during inspection, the agent modifies the XML, re-exports, and validates the output again prior to delivery.
Draw.io Diagrammer Skill Setup
To use this tool with Openclaw Skills, ensure you have the Draw.io desktop application installed on your system. On macOS, the CLI tool is located within the application bundle.
Use the following CLI pattern to programmatically export your draw.io diagrams:
/Applications/draw.io.app/Contents/MacOS/draw.io --export --format png --output out.png --scale 2 --border 30 file.drawio
Ensure that your environment path points correctly to the executable if you are running on alternative directory structures or non-macOS environments.
Draw.io Diagrammer Skill Data Schema & Taxonomy
The skill manages diagram creation and rendering quality through specific parameters and files:
| Item | Type | Description |
|---|---|---|
file.drawio |
File | The primary XML-formatted source file containing the node coordinates and connectors. |
out.png |
File | The rendered high-resolution image output used for the visual QA pass. |
--scale |
Parameter | Set to 2 to ensure readability for small text elements. |
--border |
Parameter | Configured to 30 to guarantee adequate canvas padding around outer nodes. |
Draw.io Diagrammer Skill Advanced Features
- Multi-Pass Visual Verification: Implements a structured loop that validates layout clarity prior to completing a task.
- Precision Spacing Management: Enforces universal node separation algorithms to systematically eliminate overlapping elements.
- High-Scale Rendering Engine: Utilizes local draw.io CLI configurations for predictable and scalable PNG exports.
SKILL.md
Loading
Related Openclaw Skills
LegionSpace Version Checker
A cross-platform version checker that collects the latest LegionSpace app version from seven app stores and saves a consolidated report.
blooming-elf (绽放精灵)
An AI-powered gardening companion that automates watering reminders, maintains structured plant archives, and provides real-time health diagnostics.
anymermaid
A professional tool to generate, validate, and render Mermaid syntax diagrams to SVG, PNG, and PDF formats using the mmdc CLI.
Claw Markdown Preview
A local Markdown preview server enabling real-time document rendering, side-by-side editing, and rich text export to publishing platforms.
Pincushion
Pincushion bridges the gap between stakeholder UI feedback and autonomous AI agents by translating visual browser pins into precise, context-rich agent work packets.
Draw.io Diagrammer Skill
An automated agent skill designed to generate, export, and visually inspect draw.io diagrams for technical documentation.
Featured*
