Diagram

Elige mermaid vs drawio por complejidad, escribe el diagrama en tus documentos, previsualiza vía MCP.

Por domengabrovsek · domengabrovsek/claude

Probado · Funciona ★ 9.2/10

Diagram — Elige mermaid vs drawio por complejidad, escribe el diagrama en tus documentos, previsualiza vía MCP.

Qué hace

Decide mermaid-vs-drawio usando heurísticas en línea (swimlanes, formas personalizadas, precisión de diseño), escribe el código fuente del diagrama en el documento objetivo y, para drawio, lo previsualiza en vivo a través del servidor MCP drawio antes de que el usuario exporte un PNG. Se activa con 'diagram', '/diagram', o cualquier solicitud de diagrama de flujo/arquitectura/secuencia/estado; por defecto usa mermaid para que el caso común no necesite herramientas adicionales.

Informe de la prueba

Solicité un diagrama de flujo de inicio de sesión dos veces: la respuesta de línea base (ignorada por la skill) reprodujo el mismo anti-patrón de arte ASCII que la skill prohíbe explícitamente, mientras que seguir el cuerpo de la skill produjo un archivo docs/auth-flow.md real y confirmado con un bloque sequenceDiagram de mermaid correctamente tipificado. La ruta predeterminada de mermaid no necesita nada más allá de la carpeta de skill copiada; solo la rama drawio necesita el servidor drawio .mcp.json separado, que no se copia con la instalación simple de carpeta de skill de la asignación.

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

Instalación

git clone https://github.com/domengabrovsek/claude.git
cd claude
mkdir -p ~/.claude/skills
cp -r skills/diagram ~/.claude/skills/diagram

Comandos y prompts de ejemplo

  • /diagramElige mermaid vs drawio por complejidad, escribe el diagrama en tus documentos, previsualiza vía MCP.

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 sequence diagram of the login flow for our docs
  • make a flowchart showing how requests move through our architecture
  • add an architecture diagram into this markdown file