Organize marcos, eventos históricos e roadmaps de produtos com blocos interativos e visualização SVG imediata.
Pronto.
Arraste para reordenar ou pressione Alt+Cima/Baixo
Cole aqui uma sintaxe Mermaid de linha do tempo válida. As edições visuais normalizam os espaços e removem comentários; copie antes o código com comentários.
O código válido pode ser editado diretamente e convertido no construtor visual.
Visualização ao vivo
Linha do tempo do projeto
A visualização está pronta.
O diagrama carrega quando este espaço entra em exibição ou você começa a editar.
Padrão de sintaxe
As linhas do tempo organizam a cronologia desde o cabeçalho do diagrama até os períodos e eventos. Use esta referência ao escrever a sintaxe, verificar erros de linha ou preparar diagramas para documentação Markdown.
Exemplo para copiar e colar
Recue as linhas abaixo de um período usando espaços iniciais e dois-pontos.
timeline
title Incident Review
Detection : Elevated error rate
: On-call engineer paged
Recovery : Faulty release rolled back
: Service health confirmedExemplo para copiar e colar
Use a palavra-chave section para dividir visualmente linhas do tempo longas.
timeline
title Museum Exhibition
section Preparation
Research : Select artifacts : Secure loans
Conservation : Restore pieces : Photograph catalog
section Public Program
Opening week : Press preview : Member night
Closing week : Final tours : Return loansExemplo para copiar e colar
Adicione LR para fluxo horizontal ou TD para orientação vertical.
timeline LR
title Migration Plan
Audit : Inventory workloads
Pilot : Move an internal service
Cutover : Move production trafficExemplo para copiar e colar
Use entidades HTML como #58; quando os dois-pontos fizerem parte de um rótulo de tempo.
timeline
title Operations Log
Sprint #35;4 #58; 10#58;00 UTC : Deploy at 10:00 : Verify issue #123Sem a palavra-chave do diagrama, o Mermaid informa um erro. Comece a primeira linha que não seja comentário com timeline, timeline LR ou timeline TD.
Dois-pontos sem escape em um rótulo de período podem causar um erro de análise. Use #58;.
Exemplo com erro
Abra este exemplo para ver o erro persistente e depois adicione a palavra-chave.
title Release Plan
2026 : Public launchExemplo com erro
Troque 10:00 por 10#58;00 no rótulo do período.
timeline
10:00 UTC : Public launchExemplo para copiar e colar
Organize marcos, eventos históricos e roadmaps de produtos com blocos interativos e visualização SVG imediata.
Exemplo para copiar e colar
Ideal para sequências curtas sem título ou seções.
timeline
Manhã : Reunião de equipe
Tarde : Decisão registradaExemplo para copiar e colar
Vários marcos agrupados no mesmo mês com separadores de dois-pontos.
timeline
title Conferência Comunitária
Abril : Chamada de palestrantes : Local confirmado
Junho : Programação divulgada : Inscrições abertas
Setembro : Dia do evento : Gravações publicadasExemplo para copiar e colar
Comentários permanecem no código-fonte.
timeline
title Análise de Incidente
Detecção : Taxa elevada de erros
: Plantonista acionado
Recuperação : Versão instável revertida
: Saúde do sistema confirmadaExemplo para copiar e colar
Use seções para separar o trabalho de montagem dos marcos abertos ao público.
timeline
title Exposição em Galeria
section Curadoria
Jan : Seleção de obras : Assinatura de contratos
section Montagem
Fev : Construção de vitrines : Calibração de luzes
section Público
Mar : Abertura VIP : Entrada para o públicoExemplo para copiar e colar
TD é perfeito para roadmaps longos lidos de cima para baixo.
timeline TD
title Migração de Data Center
section Preparação
Auditoria : Inventário de cargas
Piloto : Migrar serviço interno : Validar reversão
section Virada
Fim de semana 1 : Migrar bancos : Verificar réplicas
Fim de semana 2 : Migrar tráfego principal : Desligar servidores antigosExemplo para copiar e colar
Documente meses exatos de lançamento sem transformar o gráfico em um calendário complexo.
timeline
title Notas de Versão Atlas CLI
2025 Out : Versão 0.8.0 : Cache offline implementado
2026 Fev : Versão 0.9.0 : Hooks de plugins adicionados
2026 Jun : Versão 1.0.0 : API de comandos estável : Guia de migraçãoExemplo para copiar e colar
Teste como textos mais extensos são renderizados antes de publicar o diagrama.
timeline
title Comissionamento de Telescópio
Revisão operacional : Validar resultados térmicos e concluir ações de software
Janela de lançamento : Concluir integração do foguete
Primeira luz : Calibrar instrumentos primários e enviar primeira imagemUm cronograma Mermaid exibe marcos cronológicos, fases de lançamento ou eventos agrupados por períodos de tempo.
Sim. Alterne entre a orientação vertical TD e horizontal LR com facilidade.
Separe os eventos com dois-pontos ou adicione cartões no construtor visual.