Draw.io Diagrams

Genera diagramas XML de draw.io válidos y estilizados con colores, iconos y leyendas.

Por scarr05 · scarr05/claude-skills-pub

Probado · Funciona ★ 9.6/10

Draw.io Diagrams — Genera diagramas XML de draw.io válidos y estilizados con colores, iconos y leyendas.

Qué hace

Produce XML .drawio (mxfile/mxGraphModel) para diagramas de arquitectura, diagramas de flujo, topología de red y wireframes, importables directamente en draw.io/diagrams.net. Se activa ante solicitudes para crear diagramas, visuales de arquitectura, diagramas de flujo o wireframes, y agrupa referencias de iconos de AWS/Azure/GCP más una paleta de marca personalizable.

Informe de la prueba

Se generó un diagrama real de arquitectura de 3 niveles: las convenciones mxCell de la habilidad (html=1, niveles de fillColor, forma de cilindro para DB, leyenda) producen XML que realmente se renderiza correctamente en draw.io, mientras que un intento ingenuo de memoria utilizó cadenas de estilo desnudas (sin html=1, sin relleno, sin puntas de flecha) que draw.io renderiza como cuadros rotos sin estilo.

Probado el: 2026-07-16 · Claude Code 2.x (agent harness)

Instalación

git clone https://github.com/scarr05/claude-skills-pub.git
mkdir -p ~/.claude/skills
cp -r claude-skills-pub/drawio-skill ~/.claude/skills/drawio

Comandos y prompts de ejemplo

  • /drawioGenera diagramas XML de draw.io válidos y estilizados con colores, iconos y leyendas.

Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):

  • Draw a three-tier architecture diagram I can open in draw.io
  • Make me a network topology diagram with AWS icons and a legend
  • Generate a flowchart XML file for our onboarding process