▱SVG Motion Lab
UM PEQUENO LABORATÓRIO. GRANDES IDEIAS.

Dê movimento
às suas ideias.

Transforme SVGs estáticos em animações para a web. Explore, ajuste e leve o código com você.

Começar a criar ↗Experimentar um exemplo →
Sem cadastro. Sem uploads. Só você e sua criatividade.
orbita.svg · SVG Motion Lab
Ilustração de um planeta azul com órbitas e pequenos satélites↻ Spin · 6.000 ms · ∞
▶satélites
◆linear◆
6.0s
◎100% no seu navegador⌘CSS e JavaScript de verdade◇Seu SVG, suas possibilidades↓Pronto para levar ao seu site
UM EMPURRÃO NA CRIATIVIDADE

Comece com uma ideia pronta.

Abra um exemplo. Faça do seu jeito.

Planeta e satélites

Órbita ↗

Rotação, escala e um pequeno universo.

Foguete com janela azul

Decolar ↗

Um salto para experimentar o Bounce.

Quadrado, círculo e triângulo coloridos

Geometria ↗

Formas simples. Novas possibilidades.
01 / IMPORTE

Traga seu desenho.

Arraste um SVG ou abra um dos exemplos. Confira o relatório de importação e selecione uma forma.

02 / EXPERIMENTE

Encontre o ritmo.

Combine deslocamento, rotação, escala e opacidade. Ajuste o tempo e veja tudo acontecer.

03 / EXPORTE

Leve para o mundo.

Baixe CSS ou JavaScript com uma demonstração pronta. Salve o JSON para continuar depois.

APRENDER TAMBÉM É CRIAR

Seu primeiro SVG animado começa aqui.

Guias em português sobre keyframes, easing e movimento na web.

Explorar os guias →