Pular para o conteúdo

Dropdown / Menu flutuante

  • Angular: mds-dropdown
  • CSS/HTML (mds-styles): Dropdown
  • Figma: ❌
  • Tipo: Core

Um menu suspenso exibe uma lista de ações ou opções em um painel temporário. Ele pode conter multiníveis (submenus), permitindo organizar grandes volumes de comandos em categorias hierárquicas que são reveladas ao passar o mouse ou clicar.


  • Navegação Multinível: Use uma seta para a direita (ícone) para indicar que um item abre um submenu.
  • Sem Reticências em Submenus: Não utilize reticências (…) para itens que apenas abrem um submenu. A seta visual já comunica que há mais opções.
    • Certo: Exportar Documentos > (Abre lista de formatos).
    • Errado: Exportar Documentos… >
  • Nomes de Categorias: O item pai deve ser curto e categórico.
    • Exemplo: Filtros Avançados, Relatórios de Frota.
  • Limitação de Níveis: Evite ultrapassar dois níveis de profundidade (Menu > Submenu) para não dificultar a navegação e a leitura rápida.
  • Vá Direto ao Ponto: Mantenha a Caixa de Título em todos os níveis para consistência.