excalidraw-diagram-skill

Excalidraw Diagram Skill es un paquete de habilidades para agentes de codificación que genera diagramas Excalidraw a partir de descripciones en lenguaje natural. Está diseñado para agentes que cargan habilidades desde un directorio `.claude/skills/`, como Claude Code y OpenCode, y puede copiarse en un proyecto para habilitar la generación de diagramas. El proyecto enfatiza diagramas que "argumentan visualmente" en lugar de simplemente mostrar información. Según el README, las formas y grupos de formas se eligen para reflejar el concepto que se representa, como abanicos para relaciones uno a muchos, líneas de tiempo para secuencias y convergencia para agregación, en lugar de cuadrículas uniformes de tarjetas. Los diagramas técnicos pueden incluir fragmentos de código reales y cargas útiles JSON como artefactos de evidencia. Una característica notable es la validación visual integrada. Un pipeline de renderizado basado en Playwright permite al agente ver su propia salida, detectar problemas de diseño como texto superpuesto, flechas desalineadas o espaciado desequilibrado, e iterar antes de entregar el diagrama final. Los colores y el estilo de marca están centralizados en `references/color-palette.md`, por lo que reemplazar ese archivo hace que todos los diagramas sigan una paleta diferente. La instalación implica clonar el repositorio y copiarlo en `.claude/skills/excalidraw-diagram`. La configuración del pipeline de renderizado puede delegarse al agente de codificación apuntándolo a SKILL.md, o hacerse manualmente con `uv sync` y `uv run playwright install chromium` dentro del directorio de referencias. El uso es tan simple como pedirle al agente que cree un diagrama, por ejemplo uno que muestre cómo el protocolo AG-UI transmite eventos desde un agente de IA a una interfaz de usuario frontend; la habilidad maneja el mapeo de conceptos, el diseño, la generación JSON, el renderizado y la validación visual. La estructura del repositorio incluye SKILL.md para la metodología de diseño y el flujo de trabajo, además de referencias que contienen la paleta de colores, plantillas de elementos, documentación del esquema JSON, un renderizador Python para convertir archivos `.excalidraw` a PNG, una plantilla HTML de renderizado y dependencias Python para Playwright.