Olá, Daniel! Tudo joia?

Vou te dar um exemplo de como você pode fazer isso usando CSS.

Primeiro, você precisa garantir que o seu menu hambúrguer tenha um identificador ou uma classe para podermos aplicar o estilo a ele. Vamos supor que o seu menu hambúrguer tenha a classe .hamburger-menu.

Agora, para adicionar a animação, você pode usar a propriedade transition do CSS. Ela permite que você especifique a duração, o estilo e o atraso de uma transição de um conjunto de propriedades CSS. Aqui está um exemplo de como você pode usá-la:

.hamburger-menu {
  /* outras propriedades do seu menu */
  
  /* adicione a transição */
  transition: all 0.5s ease;
}

Nesse exemplo, a animação vai durar 0.5 segundos e vai usar a função de timing ease, que começa devagar, acelera no meio e depois desacelera no final. A palavra all significa que a transição será aplicada a todas as propriedades modificáveis do elemento.

Quando você alterar alguma propriedade do seu menu hambúrguer (como a altura, a largura ou a cor de fundo, por exemplo), a mudança será animada ao longo de 0.5 segundos, em vez de acontecer instantaneamente.

Espero que isso te ajude a criar a animação que você quer para o seu menu hambúrguer! Lembre-se de que a animação pode não funcionar em alguns navegadores mais antigos, então é sempre uma boa ideia testar em diferentes navegadores e dispositivos.

Espero ter ajudado e caso tenha dúvidas, estarei à disposição.

Grande abraço e bons estudos!