mcp-diagrama-iterativo-mermaid
Compiles Mermaid diagram code and existing .mmd/.mermaid files into interactive standalone HTML5/SVG diagrams with drag-and-drop, zoom, minimap, search, and layer filters.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@mcp-diagrama-iterativo-mermaidAnalyze the codebase in ./src and create an interactive architecture diagram in ./docs"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
MCP Diagrama Iterativo Mermaid (Air-Gapped)
Servidor MCP (Model Context Protocol) diseñado para que cualquier Asistente de IA (Antigravity, Claude Desktop, Cursor, VS Code, etc.) pueda analizar cualquier repositorio de código y generar diagramas de arquitectura interactivos autónomos (HTML5 + SVG + Vanilla JS) en un solo paso.
🌟 Características Principales
100% Air-Gapped (Cero Internet, Cero CDN, Cero NPM en el visor):
El archivo
.htmlresultante es un artefacto autónomo y portable que se puede abrir con doble clic en cualquier máquina o red militar/bancaria aislada.
Matemática Vectorial SVG Perimétrica:
Calcula el ángulo de incidencia $\theta = \operatorname{atan2}(\Delta y, \Delta x)$ para proyectar las flechas sobre el perímetro exterior exacto de cada tarjeta, evitando que se superpongan sobre los nodos.
Curvas de Bézier cúbicas con curvatura horizontal adaptativa.
Interactividad Completa:
Arrastrar y soltar (Drag & Drop) de nodos con recálculo fluido instantáneo de conexiones.
Paneo libre en lienzo infinito y Zoom.
Minimapa con visor de coordenadas en tiempo real.
Búsqueda en vivo que resalta coincidencias y atenúa el resto.
Filtros por capa/subgrafo.
Modal de inspección técnica al hacer clic sobre cualquier componente (responsabilidades, archivos de código, dependencias entrantes y salientes).
Inspección Automática de Proyectos:
Escanea la estructura de carpetas de cualquier repositorio (.NET, React, Python, Java, Go, etc.) y sintetiza su diagrama de componentes o convierte diagramas Mermaid (
.mmd) ya existentes.
Related MCP server: traverse
🛠️ Herramientas MCP Disponibles
Herramienta | Descripción | Parámetros Clave |
| Escanea un proyecto en disco e infiere su stack, capas arquitectónicas y diagramas existentes. |
|
| Compila cualquier texto Mermaid DSL en una app web interactiva HTML5/SVG. |
|
| Todo en uno: Analiza el proyecto y genera el |
|
| Convierte un archivo |
|
🚀 Instalación y Configuración
1. Clonar el repositorio
git clone https://github.com/martincrespo77/MCP-Diagrama-Iterativo-Mermaid.git
cd MCP-Diagrama-Iterativo-Mermaid2. Configuración en Antigravity / Claude Desktop
Agrega el servidor a tu archivo de configuración de MCP (por ejemplo ~/.gemini/config/mcp_config.json o claude_desktop_config.json):
{
"mcpServers": {
"mcp-diagrama-iterativo-mermaid": {
"command": "uv",
"args": [
"run",
"--directory",
"D:/2026/MCP-Diagrama-Iterativo-Mermaid",
"server.py"
],
"disabled": false
}
}
}💬 Ejemplos de Uso en el Chat de la IA
Una vez configurado, puedes hablarle a tu IA directamente así:
"Analiza el proyecto en
D:/MisProyectos/SistemaVentasy créame el diagrama interactivo de arquitectura en la carpeta docs.""Tengo este diagrama Mermaid, conviértelo a visor interactivo autónomo en
D:/reportes/visor.html: [código mermaid]""Convierte el archivo
docs/arquitectura.mmden un visor interactivo HTML."
📄 Licencia
MIT — Desarrollado para ecosistemas de desarrollo asistido por IA de alta fidelidad técnica.
Available Tools
4 toolsanalizar_proyectoA
Inspecciona la estructura de un proyecto en el disco local o repositorio. Detecta el stack tecnológico, las capas arquitectónicas (Frontend, API, Servicios, Dominio, Base de datos), archivos representativos y busca si ya existen diagramas (.mmd, .puml).
Args: project_path: Ruta absoluta al proyecto o repositorio (ej: 'D:/2026/MiProyecto').
| Name | Required | Description | Default |
|---|---|---|---|
| project_path | Yes |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries the full burden. It clearly communicates a read-only inspection action ('Inspecciona') and enumerates what will be examined (stack, layers, files, diagram files). It does not mention side effects or return format in detail, but for an analysis tool the disclosed scope is strong and contains no contradictions.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
Three concise sentences: purpose, detection details, and parameter explanation. The information is front-loaded and each sentence earns its place, with no filler or repetition of schema content.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a simple one-parameter inspection tool with no annotations and no output schema, the description is sufficiently complete. The agent knows the input format, what the tool will analyze, and what it will detect, so it can invoke the tool correctly without additional context.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 0%, but the description fully compensates for the single parameter: it explains project_path as the absolute path to a project or repository and provides a concrete example ('D:/2026/MiProyecto'). This adds real meaning beyond the bare schema property.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description opens with a specific verb and resource: 'Inspecciona la estructura de un proyecto en el disco local o repositorio'. It then names concrete detection targets (stack, architectural layers, representative files, existing .mmd/.puml diagrams), which makes its purpose unmistakable and distinguishes it from sibling tools that create or convert diagrams.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The inspection workflow is implied by the phrase 'busca si ya existen diagramas', suggesting the tool is a precursor to diagram creation. However, it never explicitly states when to prefer this tool over the sibling diagram tools or when not to use it, so the guidance remains implicit rather than explicit.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
convertir_archivo_mermaidA
Convierte un archivo existente con extensión .mmd o .mermaid en una aplicación web interactiva HTML5.
Args: input_file: Ruta absoluta al archivo .mmd o .mermaid. output_path: (Opcional) Ruta del .html resultante. Si no se especifica, se genera junto al archivo original.
| Name | Required | Description | Default |
|---|---|---|---|
| input_file | Yes | ||
| output_path | No |
Output Schema
| Name | Required | Description |
|---|---|---|
| result | Yes |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the behavioral burden. It discloses that the tool reads an existing file and generates an HTML file, including the default output location. It does not describe overwrite behavior, permission needs, or failure modes, which would strengthen transparency.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is concise and well-structured: a one-sentence purpose followed by a focused Args section. No filler or redundant content; every sentence adds useful information.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a simple two-parameter conversion tool, the description covers purpose, input requirements, output format, and default output behavior. The presence of an output schema means return values do not need explanation. Minor gaps like overwrite behavior and validation details prevent a perfect score.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 0%, so the description fully compensates by explaining each parameter: input_file as an absolute path to .mmd/.mermaid and output_path as optional, with the default behavior of generating next to the original file. This adds clear meaning beyond the bare schema titles.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description states a specific action: converts an existing .mmd or .mermaid file into an interactive HTML5 web application. It clearly identifies the resource type and output type, and the phrase 'archivo existente' helps differentiate it from siblings like generar_diagrama_desde_mermaid.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implies when to use the tool: when you have an existing .mmd or .mermaid file to convert. However, it does not explicitly mention alternatives, exclusions, or when not to use this tool compared to the sibling tools.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
crear_diagrama_proyectoA
Herramienta integral 'Todo en Uno': Analiza un proyecto, detecta sus capas y componentes, sintetiza su arquitectura y genera directamente el diagrama interactivo autónomo (.html) listo para ser abierto en cualquier navegador.
Args: project_path: Ruta absoluta al proyecto que se desea diagramar. output_path: (Opcional) Ruta del archivo .html destino. Por defecto se guarda en 'docs/diagrama_interactivo.html' del proyecto. titulo: (Opcional) Título del diagrama. Si se omite, usa el nombre de la carpeta del proyecto.
| Name | Required | Description | Default |
|---|---|---|---|
| titulo | No | ||
| output_path | No | ||
| project_path | Yes |
Output Schema
| Name | Required | Description |
|---|---|---|
| result | Yes |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No hay anotaciones, así que la descripción asume toda la carga, y revela el comportamiento esencial: lee el proyecto, sintetiza su arquitectura y escribe un archivo .html autónomo e interactivo, incluyendo la ubicación por defecto (docs/diagrama_interactivo.html), lo que transparenta el efecto secundario de escritura. No obstante, omite comportamientos ante casos límite como rutas inválidas, proyectos no soportados o tiempos de análisis en proyectos grandes.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
Aproximadamente 70 palabras: una frase principal que promete el valor clave (análisis + generación directa) seguida de una lista Args consistente y escaneable. Cada oración aporta información no redundante y el contenido más importante está al frente.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Existe output schema, por lo que los valores de retorno están cubiertos, y los parámetros quedan totalmente aclarados en la descripción. Faltan elementos relevantes para una herramienta de análisis compleja: criterios de selección frente a los hermanos, tipos de proyecto/lenguajes soportados, y comportamiento ante errores o proyectos no analizables.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Con 0% de cobertura en el esquema, la descripción compensa completamente documentando los tres parámetros con significado, opcionalidad y valores por defecto: project_path como ruta absoluta, output_path con su destino y default, y titulo con su fallback al nombre de la carpeta del proyecto. Esto supera ampliamente la línea base exigible cuando el esquema no aporta nada.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
La descripción usa un verbo específico ('genera') sobre un recurso claro (diagrama interactivo .html) y detalla el flujo completo: analiza, detecta capas, sintetiza arquitectura y produce el archivo. El calificativo 'Todo en Uno' y la generación 'directamente' la diferencian de los hermanos analizar_proyecto (solo análisis), generar_diagrama_desde_mermaid (requiere mermaid) y convertir_archivo_mermaid (solo conversión).
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
La etiqueta 'Herramienta integral Todo en Uno' y el adverbio 'directamente' transmiten por implicación que esta herramienta es para obtener el diagrama completo desde una ruta de proyecto, en contraste con las herramientas hermanas que cubren pasos aislados. Sin embargo, no hay criterios explícitos de cuándo usarla ni exclusiones del tipo 'si ya tienes mermaid, usa generar_diagrama_desde_mermaid'; el agente debe inferir la ruta de decisión.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
generar_diagrama_desde_mermaidA
Compila cualquier especificación textual en sintaxis Mermaid (flowchart, graph, erDiagram, classDiagram) en una aplicación web interactiva de un solo archivo (Single-File Bundle: HTML5 + SVG + Vanilla JS).
Características:
100% Air-Gapped (cero CDNs, cero npm, funciona sin conexión a internet).
Conectores dinámicos SVG con cálculo perimétrico trigonométrico exacto (atan2).
Arrastrar y soltar (drag and drop) de nodos con redibujado en tiempo real.
Paneo libre, zoom, minimapa y filtros por capas/subgrafos.
Modal de inspección de detalles de cada nodo.
Args: mermaid_code: Código Mermaid DSL (ej: 'graph LR subgraph A... end'). output_path: Ruta absoluta donde se guardará el archivo .html generado. titulo: Título visual que aparecerá en la barra superior del diagrama.
| Name | Required | Description | Default |
|---|---|---|---|
| titulo | No | Diagrama Interactivo | |
| output_path | Yes | ||
| mermaid_code | Yes |
Output Schema
| Name | Required | Description |
|---|---|---|
| result | Yes |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations present, the description carries the behavioral disclosure burden and does it well: it states the generated artifact is a single-file HTML app, reveals the air-gapped/no-CDN behavior, and lists concrete runtime features like drag-and-drop, zoom, minimap, and layered filters. It does not mention overwrite behavior or validation failures, but the key behavioral contract is clear.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The core purpose is front-loaded and the feature bullets are informative rather than filler. The list is slightly long, but each bullet conveys meaningful behavioral details that help an agent predict output quality and constraints.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given there is an output schema, the description does not need to detail return values. It covers inputs, output format, key interaction features, and the air-gapped constraint. It is slightly incomplete on edge cases like file overwriting, unsupported Mermaid diagram types, or when to prefer a sibling tool, but it is sufficient for correct invocation in the common case.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 0%, so the description must explain the parameters, and it does. It clarifies mermaid_code with an example, specifies that output_path must be an absolute path ending in .html, and explains titulo as the visual title in the top bar. This goes well beyond the bare parameter names.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states a concrete verb ('Compila'), a specific resource (Mermaid textual specs), and a definite output (single-file interactive HTML5+SVG+Vanilla JS app). It is easy to understand what the tool does, though it does not explicitly contrast itself with the sibling tools like convertir_archivo_mermaid.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The intended use case is implied: use this when you have Mermaid DSL and want an interactive, self-contained web diagram. However, there is no explicit guidance about when NOT to use it or which sibling tool should be chosen instead, such as convertir_archivo_mermaid.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections. Dates show when Glama detected each change.
4 tool updates
v0.1.0- First observed
analizar_proyecto - First observed
convertir_archivo_mermaid - First observed
crear_diagrama_proyecto - First observed
generar_diagrama_desde_mermaid
TDQS
Scored across 4 tools
Each tool's input type clearly separates it: analyze a project, create a diagram from a project, generate from Mermaid code, or convert a Mermaid file. The main overlap is between generar_diagrama_desde_mermaid and convertir_archivo_mermaid, but their input formats are explicit enough to prevent real confusion.
All tool names use lowercase snake_case with Spanish infinitive verbs, which is a coherent pattern. The minor inconsistency is that one name includes a preposition ('generar_diagrama_desde_mermaid') while others use direct compound nouns, and 'crear' vs 'generar' split similar diagram-creation actions.
Four tools is well-scoped for this server's purpose: analyze a project, generate from a project, generate from raw Mermaid code, and convert an existing Mermaid file. Each tool earns its place without unnecessary redundancy or missing critical workflow entry points.
The core workflow is covered: inspect a project, synthesize an architecture diagram, compile Mermaid code, and convert Mermaid files into interactive HTML. The main gap is the lack of an explicit tool to update or iterate on an already generated interactive diagram, but users can work around this by regenerating from the original Mermaid source.
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Create and edit architecture diagrams from your AI agent; get an SVG and a live editable canvas.
Let Claude, Cursor, or ChatGPT author Mermaid diagrams your team can read and share.
Generate dynamic Mermaid diagrams and charts with AI assistance. Customize styles and export diagr…
AI Agent with Architectural Memory. Impact analysis (free), tests and code from the graph (pro).
Related MCP Servers
- AlicenseCqualityDmaintenanceEnables agents to analyze codebases (local or GitHub) and automatically generate Mermaid diagrams rendered as PNG images via Kroki, providing visual understanding of project structure and flow through file discovery, reading, and diagram generation.315MIT
- FlicenseNot gradedqualityDmaintenanceEnables AI models to generate interactive, clickable code walkthrough diagrams using Mermaid code and node descriptions. It provides a web interface for viewing, persisting, and sharing these diagrams via a local database and a dedicated share server.263-
- AlicenseNot gradedqualityDmaintenanceAnalyzes GitHub and local repositories to automatically generate visual architectural diagrams such as dependency graphs, class diagrams, and data flow diagrams.2MIT
- AlicenseNot gradedqualityAmaintenanceProvides a dependency graph of any local repository with tools for change impact, transitive dependents, health audits, and more, enabling AI coding agents to see structure and refactor safely.4,9124MIT
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/martincrespo77/MCP-Diagrama-Iterativo-Mermaid'
If you have feedback or need assistance with the MCP directory API, please join our Discord server