SVG in eine Lottie-Animation verwandeln
Beginne mit einem SVG-Icon, Logo oder einer Illustration. Öffne die Grafik in Libre, füge Bewegung hinzu und lade eine Lottie-Animation herunter. Editor und Export sind kostenlos.
SVG animierenBearbeitung und Export sind kostenlos. Kein Konto nötig.
Editor und Dokumentation sind auf Englisch.
Von SVG zur Animation
SVG importieren
Öffne Studio und wähle Import oder ziehe die SVG-Datei in eine geöffnete Animation. Du kannst auch SVG-Code einfügen. Erscheint eine Importprüfung, vergleiche das Ergebnis mit dem Original und wähle Insert.
Die bewegte Ebene auswählen
Wähle eine Ebene aus. Klicke am Anfang der Zeitleiste auf die Raute neben Position, um den ersten Keyframe zu setzen.
Bewegung hinzufügen
Verschiebe den Abspielkopf nach vorn und ziehe die Ebene an ihre nächste Position. Mit der Leertaste spielst du die Animation ab. Drehung, Skalierung und Deckkraft lassen sich genauso animieren.
Lottie herunterladen
Wähle Export, prüfe die Lottie-Vorschau und lade Lottie JSON oder dotLottie herunter. Über Document actions → Download source kannst du zusätzlich eine bearbeitbare Libre-Quelldatei sichern.
Vor dem Import
- Eine statische SVG bewegt sich erst, wenn du Keyframes hinzufügst. Vorhandene SVG-Animationen mit CSS, SMIL oder JavaScript werden nicht in die Zeitleiste übernommen.
- Sieht eine komplexe Grafik nach dem Import anders aus, vereinfache sie oder wandle ihre Elemente im Ursprungsprogramm in Vektorpfade um. Prüfe das Ergebnis vor dem Animieren.
Erst einmal ausprobieren? Das bearbeitbare Beispiel Success öffnen.