Can this skill edit existing .drawio files?

Yes, it specializes in direct XML editing of .drawio files to adjust coordinates, styles, and elements with surgical precision without requiring a GUI.

How does it handle image conversion?

The skill utilizes conversion scripts and pre-commit hooks to generate high-resolution (2x scale), transparent PNGs from XML source files automatically.

Does it support AWS icons?

Yes, it includes specialized search scripts to find the latest AWS official icons (mxgraph.aws4) and provides patterns for their correct implementation.

Why are arrows placed at the back layer in this skill?

Placing arrows in the background layer (immediately after the title in XML) ensures that labels, boxes, and icons remain fully visible and aren't obscured by lines.

Is it compatible with presentation tools?

Yes, it includes specific optimizations for Quarto and reveal.js slides, such as font family standardization (Noto Sans JP) and image scaling settings.

Draw.io Diagrams

Name: Draw.io Diagrams
Author: softaworks

bysoftaworks

•

347

Design Tools

Manages draw.io diagram lifecycles including XML editing, high-resolution PNG conversion, and AWS architecture visualization with precise layout control.

About

This skill empowers AI agents to create, edit, and maintain professional technical diagrams directly within a repository using the draw.io XML format. It provides specialized rules for coordinate adjustment, layer management, and AWS icon integration, ensuring diagrams remain consistent and high-quality. With built-in support for PNG conversion and specific optimizations for reveal.js slides and Quarto documentation, it streamlines the process of keeping documentation and architectural visuals in sync with code changes, allowing for automated updates to complex system designs.

Key Features

Direct XML editing and coordinate adjustment for .drawio files
Advanced layout rules for margins, font consistency, and layer ordering
Optimized export settings for Quarto and reveal.js presentations
Automated high-resolution PNG conversion with transparent backgrounds
347 GitHub stars
Integrated AWS icon search and standardized usage patterns

Use Cases

Generating and updating AWS cloud architecture diagrams during infrastructure changes
Maintaining sequence and flow diagrams within technical documentation repositories
Automating diagram-to-image conversion for use in slide decks and READMEs

About

Key Features

Direct XML editing and coordinate adjustment for .drawio files
Advanced layout rules for margins, font consistency, and layer ordering
Optimized export settings for Quarto and reveal.js presentations
Automated high-resolution PNG conversion with transparent backgrounds
347 GitHub stars
Integrated AWS icon search and standardized usage patterns

Use Cases

Generating and updating AWS cloud architecture diagrams during infrastructure changes
Maintaining sequence and flow diagrams within technical documentation repositories
Automating diagram-to-image conversion for use in slide decks and READMEs