Lottie-Player, Farbeditor und Optimierer — komplett lokal
Öffne .lottie-, .tgs- und .json-Animationen, färbe jede Füllung, Kontur und jeden Verlaufsstopp neu ein, prüfe, was in anderen Playern kaputtgeht, und exportiere als JSON, SVG, PNG, Bildsequenz oder WebM — alles im Browser.
Öffne eine Animation, um ihre Struktur zu sehen.
So funktioniert es
Datei ablegen
Ein rohes .json, ein .lottie-Archiv, ein Telegram-Sticker .tgs oder ein gezipptes .json.gz. Nichts wird irgendwohin hochgeladen.
Bericht lesen
Noch bevor etwas gerendert wird, bekommst du Größe, Ebenenzahl und eine Liste dessen, was auf iOS, Android oder älteren Playern bricht.
Umfärben und trimmen
Jede Füllung, Kontur, jeder Verlaufsstopp und jeder Farb-Keyframe wird zu einem Farbfeld. Ebenen ausblenden, Bereich trimmen, Bildrate überschreiben.
Exportieren oder weitermachen
JSON, .lottie, SVG, PNG, eine nummerierte Bildsequenz oder ein WebM-Video — oder schick das Ergebnis direkt an ein anderes Tool der Suite.
Nichts verlässt deinen Rechner
Player, Farbeditor, Optimierer und jeder Export laufen auf deiner eigenen CPU. Kein Upload, kein Konto, keine Warteschlange — und es funktioniert auch mit gezogenem Netzstecker.
Farben, die andere Viewer übersehen
Die meisten Online-Viewer finden nur statische Füllungen. Dieser erkennt zusätzlich Konturen, Verlaufsstopps, Farbflächen und Keyframes animierter Farben — und sagt dir, wie oft jede Farbe vorkommt.
Ein echter Ebenenbaum
Jede Ebene der obersten Stufe mit Typ, Expressions und Track-Mattes, dazu ein Schalter, um ungewollte auszublenden. Danach lassen sie sich aus der exportierten Datei entfernen.
Ein Optimierer, der seine Rechnung offenlegt
Koordinaten runden, die der Exporter mit fünfzehn Stellen geschrieben hat, Autoren-Metadaten streichen und ausgeblendete Ebenen entfernen halbiert die Datei regelmäßig. Du siehst die Bytes vorher und nachher, kein Versprechen.
Bild- und Videoexport
Der aktuelle Frame als PNG oder SVG, der ganze Bereich als nummerierte PNG-Sequenz im ZIP oder ein framegenaues WebM-Video. Alles auf einem Canvas in diesem Tab gerendert.
Ein Kompatibilitätsbericht
Expressions, Pfadzusammenführungen, Ebeneneffekte, Textebenen, 3D-Flags und per URL referenzierte Bilder — genau das, was eine Animation hier richtig und auf dem Handy falsch aussehen lässt.
Ein Player, der rendert — keine Vorschau, die gestreamt wird
Die Animation wird von lottie-web gerendert, das auf dieser Seite läuft — mit der Bildrate des Dokuments, framegenauem Scrubbing und einer echten Steuerung: Frame für Frame springen, rückwärts abspielen, den Bereich trimmen, die Bildrate überschreiben. Weil der Renderer lokal ist, gibt es keine Upload-Wartezeit und keine Qualitätsgrenze durch einen Vorschaudienst.
Öffne eine Lottie-Animation, sieh genau, was drinsteckt, färbe sie um, nimm ihr das überflüssige Gewicht und exportiere sie im Format, das du wirklich brauchst — ohne sie irgendwem hochzuladen.
Die Design-Abteilung liefert ein Lottie mit 900 KB, das auf Android bricht. Dieses Tool sagt dir vorher, warum, lässt dich es ohne Umweg über After Effects auf die Markenfarben umfärben, entfernt die vom Exporter zurückgelassenen ausgeblendeten Ebenen und gibt dir die Datei als JSON, .lottie, SVG, PNG, Bildsequenz oder WebM zurück.
Alles passiert in diesem Tab. Das Tool markiert außerdem Animationen, die Bilder per URL referenzieren — der einzige Fall, in dem ein Lottie nicht eigenständig ist — und bettet sie für dich ein, wenn sie in einem .lottie-Archiv ankommen.
Häufige Fragen
QWerden meine Animationen irgendwohin hochgeladen?+
Nein. Die Datei wird mit der File API des Browsers gelesen, im Speicher verarbeitet und von einem Player gerendert, der mit dieser Seite ausgeliefert wird. Es gibt zu keinem Zeitpunkt einen Serveraufruf, und zwischen zwei Besuchen bleibt nichts gespeichert.
QWelche Dateiformate kann ich öffnen?+
Ein rohes .json-Lottie, ein .lottie-Archiv (das Format, das lottiefiles.com standardmäßig ausgibt), einen Telegram-Sticker .tgs und ein gezipptes .json.gz. Der Container wird am Inhalt erkannt, eine falsch benannte Datei öffnet sich also trotzdem.
QWarum läuft nichts los, sobald ich eine Datei ablege?+
Absicht. Das Ablegen liest und untersucht die Datei nur; zuerst bekommst du Größe, Struktur und Kompatibilitätsbericht, und der Player startet, wenn du den Knopf drückst. Wer das überspringen will, fügt das JSON von Hand ein — dann öffnet es sofort.
QWelche Farben lassen sich wirklich bearbeiten?+
Statische Füllungen und Konturen, jeder Stopp einer Verlaufsfüllung oder -kontur, die Farbe einer Farbfläche und jeder Keyframe einer animierten Farbeigenschaft. Farben, die in einem eingebetteten PNG stecken oder von einem Ebeneneffekt erzeugt werden, lassen sich nicht ändern — das kann kein Editor, ohne das Asset neu zu zeichnen.
QWie viel kleiner macht der Optimierer eine Datei?+
Das hängt völlig von der Quelle ab, deshalb zeigt das Tool die echten Bytes vorher und nachher, statt eine Zahl zu behaupten. Dateien frisch aus After Effects werden bei zwei Nachkommastellen meist 40-60 % kleiner, weil ihr Gewicht fast nur aus Koordinaten mit fünfzehn signifikanten Stellen besteht.
QKann ich ein GIF exportieren?+
Nicht direkt, und das ist Absicht: Ein GIF-Encoder im Browser würde die Farben einer Vektoranimation posterisieren. Exportiere stattdessen eine nummerierte PNG-Sequenz oder ein WebM — beide behalten die volle Palette, und jeder Encoder macht daraus verlustfrei ein GIF.
QBeschädigt das Umfärben die Animation?+
Nein. Jede Änderung wird als Patch über dem Originaldokument gespeichert, das nie angefasst wird. Rückgängig, Wiederholen, Palette zurücksetzen oder „Vergleichen“ gedrückt halten zeigt dir jederzeit die unberührte Datei.