É possível sim, basta trocar o color
do ícone, pois ela é uma propriedade que pode ser animada sem problemas. Como o FontAwesome é uma fonte vc deve usar o color
para isso, e com o @keygrames
vc faz a animação. Aqui vc pode ler mais sobre os @keyframes
https://developer.mozilla.org/pt-BR/docs/Web/CSS/@keyframes
Um exemplo aplicando a técnica.
SeguePara simular o códigomesmo efeito que vc fez com jQuery a animação tem 4s, sendo que demora 2s para trocar a cor (50% da imagem acima:animação) e mais 2s para voltar para a cor original (outros 50% da animação). Pra entender melhor olha o código abaixo.
.fa-bars {
color: #fff;#FAFAFA;
animation: bg 6s4s infinite;
}
@keyframes bg {
25% {
color: red;
}
50% {
color: blue;
}
75% {
color: green;#0069D9;
}
}
header {
background-color: silver;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css" rel="stylesheet"/>
<header>
<a id="toggleMenu" href="#" style="font-size: 2em"><i class="fas fa-bars"></i></a>
</header>