Visor de Diagramas de Gantt de Mermaid
Renderiza diagramas de Gantt de Mermaid al instante en tu navegador. Visualiza cronogramas de proyectos y exporta a SVG o PNG. Gratis, sin instalación.
Introduce código Mermaid para previsualizar tu diagrama
Los diagramas de Gantt visualizan los cronogramas de los proyectos al mapear tareas en un eje de tiempo, mostrando fechas de inicio, duraciones, dependencias e hitos. La sintaxis `gantt` de Mermaid permite a los gerentes de proyecto y líderes de ingeniería redactar un cronograma como texto plano y renderizarlo en cualquier lugar sin una herramienta de gestión de proyectos dedicada. Los asistentes de IA se utilizan cada vez más para la planificación de proyectos: los desarrolladores le piden a Claude o ChatGPT 'Crea un plan de sprint de 6 semanas para construir un sistema de autenticación de usuarios' y reciben un diagrama de Gantt de Mermaid estructurado. Pegar la salida en Zolkit te permite revisar el plan, identificar conflictos de programación y exportarlo para una presentación a las partes interesadas antes de comprometerte con una herramienta de gestión de proyectos. Los diagramas de Gantt de Mermaid admiten secciones de tareas, posicionamiento basado en fechas, tareas secuenciales y paralelas con dependencias `after`, marcadores de hitos y tareas marcadas como `done`, `active` o `crit` (ruta crítica). El visor de Zolkit renderiza todas estas construcciones fielmente y exporta el gráfico como SVG para una reproducción exacta en presentaciones y documentación.
Visor y Exportador de Diagramas Mermaid Online Gratis
El Visor de Diagramas Mermaid de Zolkit te permite pegar cualquier código Mermaid y ver un diagrama renderizado al instante — sin instalación, sin registro, sin subidas a servidores. Todo se ejecuta en tu navegador, lo que lo convierte en la forma más rápida de verificar diagramas generados por IA desde Claude, ChatGPT o Gemini. Soporta todos los tipos principales de diagramas Mermaid: diagramas de flujo, diagramas de secuencia, diagramas de clases, diagramas ER, diagramas de Gantt, diagramas de estado, mapas mentales, gráficos Git, gráficos circulares y líneas de tiempo.
Vista Previa Instantánea en Vivo
Los diagramas se renderizan automáticamente mientras escribes, con un retardo de 300 ms para que nunca se sienta lento.
100% Privado
Todo el renderizado ocurre en tu navegador usando mermaid.js. Tu código nunca se envía a ningún servidor.
Exportar SVG y PNG
Descarga tu diagrama como un SVG vectorial nítido o un PNG de alta resolución 2× listo para documentos y presentaciones.
Todos los Tipos de Diagramas Mermaid
Soporta diagramas de flujo, diagramas de secuencia, diagramas de clases, diagramas ER, diagramas de Gantt, mapas mentales, gráficos Git y más.
Listo para Diagramas de IA
Construido para la era de la IA — previsualiza directamente diagramas generados por Claude, ChatGPT, Gemini o cualquier LLM.
Siempre Gratis
No se necesita cuenta, sin límites de uso, sin marcas de agua. El visor Mermaid de Zolkit es completamente gratuito para siempre.
Cómo Previsualizar un Diagrama Mermaid
- 1
Pega tu código Mermaid en el editor de la izquierda — puedes copiarlo desde un asistente de IA o escribirlo manualmente.
- 2
El diagrama se renderiza instantáneamente en el panel de vista previa de la derecha. Si hay un error de sintaxis, un mensaje explica el problema.
- 3
Haz clic en 'Exportar SVG' o 'Exportar PNG' para descargar tu diagrama como un archivo listo para documentación, presentaciones o compartir.
Preguntas Frecuentes
¿Cómo establezco dependencias de tareas en un diagrama de Gantt de Mermaid?
Usa la palabra clave `after` para referenciar una tarea anterior: `Frontend : b1, after a1, 10d`. La tarea b1 comenzará inmediatamente después de que termine la tarea a1. Puedes encadenar múltiples dependencias. Los IDs de las tareas se definen después del nombre de la tarea y antes de la fecha de inicio. Si no se especifica un ID, la tarea no se puede referenciar como dependencia.
¿Cómo agrego hitos a un diagrama de Gantt de Mermaid?
Define una tarea con `milestone` como tipo y `0d` como duración: `Release : milestone, after testing, 0d`. Los hitos se renderizan como formas de diamante en la línea de tiempo de Gantt, haciendo que los puntos clave de entrega o las puertas de decisión sean visualmente distintos de las tareas regulares. Son útiles para marcar lanzamientos de versiones, aprobaciones de juntas o puntos de control de ir/no ir.
¿Qué formatos de fecha admite Mermaid Gantt?
El formato más común es `AAAA-MM-DD` (por ejemplo, `2024-03-15`), declarado en la parte superior con `dateFormat YYYY-MM-DD`. Mermaid también admite `MM/DD/AAAA`, `DD-MM-AAAA` y marcas de tiempo Unix. Las duraciones se expresan en días (`10d`), horas (`8h`) o semanas (`2w`). Siempre declara `dateFormat` antes de cualquier fecha de tarea.
¿Cómo marco tareas como críticas o completadas?
Agrega palabras clave de estado antes del ID de la tarea: `crit` marca una tarea como crítica (se renderiza en rojo), `done` la marca como completada (se renderiza como rellena) y `active` la marca como en progreso. Puedes combinarlas: `crit, done` para una tarea crítica completada. Estas señales visuales hacen que los diagramas de Gantt sean útiles para informes de estado y revisiones de progreso.