← Voltar à biblioteca
Feedback

Bloco de destaque

Callout

Um bloco destacado que complementa o conteúdo com uma nota, dica ou cuidado.

✧ Uma dica antes de começar

Nomeie seus componentes pelo que fazem.

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

Quando usar

Dar ênfase a informações de apoio em documentação ou artigos.

Cuidados e acessibilidade

Um destaque visual não exige anúncio de alerta; use a semântica de acordo com a urgência.

Partes e comportamento

Título opcional e conteúdo complementar destacado.

Não confunda

Destaque editorial não implica urgência e não precisa usar role=alert.

Exemplo de código

<aside aria-labelledby="dica">
  <h2 id="dica">Antes de começar</h2>
  <p>Nomeie seus componentes pelo que fazem.</p>
</aside>

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

Peça assim para uma IA

BIBLIOTECA UI / EXPLORAR