← Voltar à biblioteca
Dados

Linha do tempo

Timeline

Organiza acontecimentos em uma sequência temporal.

  1. 09:20Pedido recebido
  2. 10:45Pagamento confirmado
  3. 14:10Em preparação

Exemplo didático · Representação visual do padrão

Quando usar

Apresentar histórico de atividade ou acompanhamento de uma entrega.

Cuidados e acessibilidade

Escreva as datas e a ordem de forma explícita; a linha decorativa não basta.

Partes e comportamento

Eventos ordenados com data, título e informações complementares.

Não confunda

Feed enfatiza atualização recente; timeline enfatiza sequência temporal.

Exemplo de código

<ol aria-label="Histórico do pedido">
  <li><time datetime="2026-09-25T09:20:00-03:00">25/09, 09:20</time> Pedido recebido</li>
  <li><time datetime="2026-09-25T10:45:00-03:00">25/09, 10:45</time> Pagamento confirmado</li>
</ol>

Trecho didático. Integre e teste no contexto do seu projeto.

Peça assim para uma IA

BIBLIOTECA UI / EXPLORAR