Anime cada camada SVG separadamente
Atribua a cada parte do logótipo, ícone, forma ou grupo o seu próprio preset, duração, atraso, easing e ordem sem perder as animações das outras camadas.
← Todas as ferramentas SVG
ESTUDIO SVG EM DESTAQUE
ANIMAÇÃO SVG · ESTÚDIO EM DESTAQUE
Animar SVG online com SVG Animation Studio
Anime SVG online camada a camada com presets de movimento, timing independente, timeline visual e exportação local no navegador.
Funciona localmente no navegador. O seu SVG permanece no dispositivo.
ESTUDIO SVG EM DESTAQUE
O que quer animar?
Comece pelo tipo de grafico em que esta a trabalhar. Pode mudar o preset a qualquer momento.MOTION LIBRARY
Predefinicoes de movimento
Escolha um ponto de partida e ajuste tempos e alvo no estudio.SVG MOTION WORKSPACE
Estudio de animacao
Carregue um SVG, anime o gráfico completo ou camadas individuais, organize os tempos na timeline e gere SVG, Lottie ou MP4.Funciona localmente no navegador. O seu SVG permanece no dispositivo.
01Origem
Escolhe ou arrasta o teu ficheiro SVG
Arrasta-o para aqui ou clica para procurar
SVG pronto
Fundo da pre-visualizacao
05Exportar
Descarregue o SVG animado ou copie o CSS e o codigo HTML gerados.
Vantagens
Um estúdio de animação SVG por camadas
Organize o movimento numa timeline visual
Reordene as camadas animadas e escolha se cada faixa começa com a anterior ou depois dela, mantendo um atraso adicional para ajustar o timing.
Exporte para web, apps e vídeo
Gere SVG animado, Lottie transparente ou vídeo MP4 com processamento local e pré-visualização antes da exportação.
Como funciona
Como animar um SVG online
- 1Carregue um SVG, cole o código SVG ou abra a demo integrada.
- 2Selecione todo o SVG ou uma camada, escolha um preset e ajuste duração, atraso, easing e repetição.
- 3Adicione mais camadas animadas, reordene as faixas e escolha Com a anterior ou Depois da anterior para criar a sequência.
- 4Veja a pré-visualização, escolha um canvas 1:1, 9:16 ou 16:9 quando necessário e gere SVG animado, Lottie ou MP4.
Continuar
Ferramentas relacionadas
FAQ
Perguntas frequentes
Posso animar um logótipo SVG online?
Sim. SVG Animation Studio inclui efeitos de reveal, escala, desenho, bounce, pulse, float e sequências adequados a logótipos, ícones e ilustrações vetoriais.
Posso animar as camadas de um SVG separadamente?
Sim. Cada elemento ou grupo SVG selecionável pode manter as suas próprias definições de animação. Pode animar outra camada sem apagar o movimento atribuído às anteriores.
Posso controlar a ordem das animações SVG?
Sim. As camadas animadas aparecem numa timeline onde pode reordenar as faixas, iniciar com a faixa anterior ou depois dela e adicionar um atraso extra.
Que formatos posso exportar?
O Studio pode gerar SVG animado, Lottie JSON e vídeo MP4. O SVG mantém-se vetorial, Lottie conserva uma composição transparente e o MP4 normal precisa de um fundo.
Que proporções posso usar para vídeo e Lottie?
As exportações raster podem usar formatos standard 1:1, 9:16 e 16:9 com uma margem de segurança para evitar cortes durante o movimento.
O meu SVG é enviado?
O fluxo suportado de animação e exportação foi concebido para funcionar localmente no navegador sem enviar o SVG de origem para o servidor da aplicação.
Funciona com qualquer SVG?
A maioria dos SVG vetoriais standard funciona bem. Documentos muito complexos, conteúdo incorporado invulgar ou elementos não suportados podem ser simplificados ou recusados por segurança.
Posso animar SVG sem escrever CSS ou JavaScript?
Sim. O SVG Animation Studio permite aplicar presets, timing, easing e sequências visualmente sem construir a animação manualmente.
Qual é a diferença entre animação SVG com CSS, SMIL e JavaScript?
CSS funciona bem para estilos e transformações, SMIL fornece animação declarativa em navegadores compatíveis e JavaScript oferece maior controlo para interação e timelines complexos.
O que é uma animação de path ou draw em SVG?
Revela progressivamente um path SVG, normalmente animando stroke-dasharray e stroke-dashoffset. É útil para ícones de linha, assinaturas e logótipos de contorno.
Devo exportar como SVG animado, Lottie ou MP4?
Usa SVG animado para um resultado vetorial nativo da web, Lottie quando o fluxo suporta JSON Lottie e MP4 quando precisas de vídeo amplamente compatível.
ALLONLINE.TOOLS
