📊 Skill: Diagram Design
Resumen de la Skill
Creación de diagramas técnicos de alto impacto visual (arquitectura, flujos, secuencia, ER, líneas de tiempo) en HTML/SVG estático o bloques Mermaid nativos.
🎨 Tipos de Diagramas Soportados
- Arquitectura de Software: Diagramas de componentes, motores duales y tuberías de datos.
- Flujogramas (
flowchart TD/flowchart LR): Algoritmos, árboles de decisión y flujos lógicos. - Diagramas de Secuencia (
sequenceDiagram): Protocolos cliente-servidor, sincronización y WebSocket. - Líneas de Tiempo / Roadmap: Evolución de versiones y lanzamientos de software.
💡 Reglas de Formato para Mermaid en Obsidian
- Evitar HTML en etiquetas: Usar texto limpio entre corchetes o comillas.
- Etiquetas con caracteres especiales: Encapsular siempre entre comillas:
id["Nodo (Detalle)"]. - Paleta de Colores: Adaptar los estilos a las variables CSS del tema de Obsidian para que se vean nítidos tanto en modo oscuro como en modo claro.