Diagrama de Gantt
Planifica proyectos sobre una línea de tiempo clara
¿Qué es un Diagrama de Gantt?
Un diagrama de Gantt coloca las tareas en un calendario con duraciones, dependencias e hitos. Es el estándar de la gestión de proyectos para mostrar quién hace qué, cuándo, y qué depende de qué.
Los diagramas de Gantt aparecen en comités de dirección y planes de release, donde el público quiere fechas más que lógica. Escritos como texto ganan una ventaja poco habitual: el plan se revisa en el mismo pull request que el trabajo que describe. Su debilidad es que envejecen mal — un Gantt es una foto de una intención, y nada en Mermaid te avisa de que dejó de coincidir con la realidad hace tres semanas.
Ejemplo en directo
gantt
title Product Launch
dateFormat YYYY-MM-DD
section Design
Wireframes :a1, 2026-01-05, 10d
UI design :a2, after a1, 14d
section Build
Backend API :b1, 2026-01-12, 21d
Frontend :b2, after a2, 18d
section Launch
Beta testing :c1, after b2, 10d
Go live :milestone, after c1, 0dCuándo usarlo
Errores frecuentes
dateFormat no coincide con tus fechas
Con dateFormat YYYY-MM-DD, una tarea que empieza el 05/01/2026 no se rechaza: se interpreta como otra fecha y el diagrama se estira en silencio a lo largo de meses. Haz que coincidan, o declara dateFormat DD/MM/YYYY.
Dos puntos dentro del nombre
Todo lo anterior a los primeros dos puntos es la etiqueta, así que Phase 1: discovery :a1, 2026-01-05, 7d dibuja una tarea llamada «Phase 1» y descarta el resto del nombre sin avisar. Usa un guion en los nombres.
Reutilizar el identificador de una tarea
Los identificadores deben ser únicos. Si dos tareas comparten uno, after apunta a la última declaración y una tarea dependiente salta semanas hacia delante sin ningún error. Prefija los identificadores por sección — d1, b1, l1 — para distinguirlos.
Sintaxis básica
gantt
dateFormat YYYY-MM-DD
section Phase 1
Task A :a1, 2026-01-01, 7d
Task B :after a1, 5ddateFormat YYYY-MM-DD axisFormat %d/%mdateFormat le dice a Mermaid cómo leer las fechas que escribes; axisFormat controla cómo se imprimen a lo largo del eje. Son independientes y a menudo distintos.
Backend API :active, b1, 2026-01-12, 21dUna línea de tarea es etiqueta, luego marcas, identificador, inicio y duración. Las marcas son done, active, crit y milestone; el inicio puede ser una fecha o after b1.
excludes weekends todayMarker stroke-width:4px,stroke:#e11excludes quita del calendario laboral los fines de semana o fechas concretas. todayMarker cambia el estilo de la línea de la fecha actual, y todayMarker off la oculta por completo.
section Launch Go live :milestone, m1, after c1, 0dLas secciones agrupan tareas en líneas de trabajo, cada una con su banda de color. Un hito con duración cero se dibuja como un rombo en lugar de una barra.
Preguntas sobre este diagrama
¿Pueden las tareas depender unas de otras?
Sí — usa «after taskId» para encadenar tareas, e hitos para marcar las fechas clave. Las secciones agrupan las tareas por línea de trabajo o por equipo.
¿Es un Gantt en texto mejor que una herramienta de proyectos?
Para comunicar, sí: vive en tus docs, se versiona con git y se actualiza en segundos. Para gestionar recursos, combínalo con tu herramienta de gestión de proyectos.
¿Cómo comparto un diagrama de Gantt con quien no usa Mermaid?
Exporta PNG para presentaciones y correo, SVG para lo que vaya a ampliarse, o publica el diagrama como página pública y envía el enlace: el enlace sigue mostrando la versión actual cuando actualizas el plan.
¿Puede un Gantt de Mermaid mostrar responsables o porcentaje completado?
No. No hay columna de recursos ni barra de progreso; la única información de estado son las marcas done, active y crit de una tarea. Deja la planificación de capacidad en tu herramienta y usa el diagrama para comunicar.
¿Dibuja Mermaid flechas entre tareas dependientes?
No. Escribir after b1 fija la fecha de inicio de una tarea, pero no dibuja ninguna flecha de dependencia, así que el vínculo queda invisible. Dilo en el nombre de la tarea, o usa un diagrama de flujo cuando el grafo de dependencias sea el mensaje.
¿Cómo marco la fecha de hoy en el diagrama?
Mermaid dibuja por defecto un marcador en la fecha actual, tomada del reloj de quien renderiza el diagrama. todayMarker stroke-width:4px,stroke:#e11 le cambia el estilo y todayMarker off lo elimina — útil cuando el diagrama es una plantilla reutilizable y no un plan vivo.
¿Diagrama de Gantt u otro tipo de diagrama?
¿Diagrama de Gantt o línea de tiempo?
El Gantt es para el trabajo que aún no ha ocurrido: duraciones, dependencias, camino crítico. La línea de tiempo es para eventos con fecha pero sin duración — releases, incidentes, historia de la empresa. Si nada de tu lista dura, quieres una línea de tiempo.
¿Diagrama de Gantt o diagrama de flujo?
Los dos describen un plan. El de flujo conserva las ramificaciones — qué pasa si la auditoría falla — e ignora el calendario; el Gantt conserva el calendario y aplana cada rama en un único camino nominal. Los comités de dirección quieren el Gantt; los equipos de entrega suelen necesitar los dos.
Crea tu Diagrama de Gantt ahora
Descríbelo en lenguaje natural — la IA escribe el código Mermaid por ti.
Abrir Mermaid Studio