Feedback
Selo informativo
Badge
Um marcador compacto de contagem, novidade ou estado.
Caixa de entrada 4NovoConcluído
Exemplo didático · Representação visual do padrão
Quando usar
Indicar itens não lidos, status ou informação complementar.
Cuidados e acessibilidade
Inclua significado textual e não faça a informação depender apenas de cor.
Partes e comportamento
Marcador compacto ligado a um conteúdo, estado ou contagem.
Não confunda
Tag classifica, chip pode representar uma seleção, badge sinaliza estado ou contagem.
Exemplo de código
<span>Caixa de entrada <span aria-label="4 mensagens não lidas">4</span></span>Trecho didático. Integre e teste no contexto do seu projeto.