Há um site que se destaca pela animação de seu logo: animista.net, uma ferramenta de design que podemos usar para criar animações CSS sem precisar de programação.
Após vários usuários perguntarem como conseguiram animar o arquivo SVG em sua página inicial, os responsáveis começaram a trabalhar em um projeto para ajudar a fazer exatamente isso: criar animações a partir de um SVG.
Leia também:PARA QUEM BUSCA ANIMAÇÕES FEITAS COM CSS
O resultado é svgartista.net, uma ferramenta que simplifica o processo de criação da animação que animista tem na sua página e que acabou superando sua ideia principal, se transformando em um projeto separado.
O SVG Artist ajuda a animar as propriedades de traço e preenchimento, em imagens SVG com um código CSS simples.
A ferramenta gera o CSS necessário e atualiza o código SVG para que possa ser facilmente animado, atribuindo a classe .active ao elemento SVG. Não depende de bibliotecas JS de terceiros para funcionar, embora, provavelmente, acabemos usando alguns para definir dinamicamente a classe .active em algum tipo de acionador (por exemplo, na exibição de rolagem).
Leia também:KEYFRAMES, UM EDITOR ONLINE PARA CRIAR ANIMAÇÕES EM CSS
O resultado deve funcionar em todos os navegadores modernos.
O código gerado pelo SVG Artist não tem garantia de nenhum tipo, por isso, é aconselhável experimentá-lo bem antes de colocá-lo em produção.