Become a
certified expert

with

LottieFiles for Figma
certification

LottieFiles

+

Figma

Figma zu Lottie:
Bewegung in Figma bringen

Konvertieren Sie Ihre Entwürfe oder Prototypen mühelos mit der Funktion 'Figma to Lottie' in produktionsbereite Lottie-Animationen. Verwenden Sie LottieFiles für Figma Dev Mode, um Einbettungscodes und Asset-Links direkt innerhalb des Tools zu erhalten und Dateien ohne Umstände zu übergeben.

Exportieren Sie Ihre Figma-Designs als Lottie-Animationen und verwenden Sie sie auf Ihren Websites oder Apps. Erhalten Sie sofortigen Zugriff auf die weltweit größte Lottie-Animationsbibliothek innerhalb von Figma.

Made in Figma to Lottie

Exportieren Sie Ihre Figma-Designs als Lottie-Animationen und verwenden Sie sie auf Ihren Websites oder Apps. Erhalten Sie sofortigen Zugriff auf die weltweit größte Lottie-Animationsbibliothek innerhalb von Figma.

  • Mandy Scott

  • Diego Gonzalez

  • Mau Ali

  • Diego Gonzalez

  • Amanda Patamakanthin

  • Lana Nguyen

  • Yaante Ahumad

  • Mandy Scott

  • Diego Gonzalez

  • Mau Ali

  • Diego Gonzalez

  • Amanda Patamakanthin

  • Lana Nguyen

  • Yaante Ahumad

  • Swaraj Thamke

  • Diego Luque

  • Sanjib Paul

  • Anshul Gupta

  • Kenmin Mohakim

  • Keljib Poh

  • Swaraj Thamke

  • Diego Luque

  • Sanjib Paul

  • Anshul Gupta

  • Kenmin Mohakim

  • Keljib Poh

  • Melih Okal

  • Diego Gonzalez

  • Yaamin Mohamed

  • Luis Berumen

  • Sanjib Paul

  • Sepideh Yazdi

  • Melih Okal

  • Diego Gonzalez

  • Yaamin Mohamed

  • Luis Berumen

  • Sanjib Paul

  • Sepideh Yazdi

Produktionsbereite Animationen auf Figma

Erstellen Sie produktionsfertige Lottie-Animationen

Die Figma-to-Lottie-Funktion ermöglicht es Ihnen, mit Leichtigkeit fesselnde Animationen innerhalb von Figma zu erstellen und sie als Lottie zu exportieren. Wählen Sie zwischen der Verwendung von animierten Voreinstellungen oder dem Verbinden mehrerer Frames, um Ihre Animationen zu erstellen.

AI Prompt to Vector
AI Prompt to Vector

AI Aufforderung zum Vektor

Verwandeln Sie Textvorgaben in benutzerdefinierte SVG-Illustrationen und umgehen Sie die Suche nach perfekten Ressourcen. Nutzen Sie die KI-gestützte Gruppierung und Benennung von Ebenen, um Ihr Design sauber und organisiert zu halten.

🎉 Neu

Raster zu Vektor
Raster zu Vektor

Raster zu Vektor

Konvertieren Sie Rasterbilder wie PNGs und JPGs in vollständig bearbeitbare Vektoren und sagen Sie Tschüss zum manuellen Nachzeichnen. Verwenden Sie sie sofort in Ihren Designs oder nachdem Sie sie mit Figma zu Lottie animiert haben.

🎉 Neu

Download animations directly to your device
Download animations directly to your device

Laden Sie Animationen direkt auf Ihr Gerät herunter

Laden Sie Animationen als optimierte dotLottie/Lottie JSON, dotLottie oder Lottie JSON direkt auf Ihr Gerät herunter. Sie können sie auch als GIF, MP4, WebM oder MOV in mehreren Größen exportieren.

🎉 Neu

Premium animations
Premium animations

Premium Animationen

Greifen Sie auf über 400.000 exklusive und vollständig anpassbare Premium-Animationen innerhalb von Figma zu, um atemberaubende Produkte zu erstellen, die Ihre Benutzer lieben werden.

Search Lottie animations
Search Lottie animations

Animationen für jede erdenkliche Branche und jeden denkbaren Anwendungsfall

Suchen Sie über 100.000 kostenlose, sofort einsatzbereite Lottie-Animationen in unserem Figma-Plugin. Alle Animationen können für den persönlichen und kommerziellen Gebrauch verwendet werden.

Entwerfen Sie Prototypen genauso wie endgültige Produkte

Fügen Sie Lottie-Animationen zu Ihren Figma-Prototypen hinzu und präsentieren Sie die realistischste und ansprechendste Version Ihrer Designs Ihren Interessengruppen. Kommunizieren Sie effektiv mit Bewegung und beseitigen Sie das Rätselraten.

Lottie Stickers for FigJam
Lottie Stickers for FigJam

Lottie-Sticker für FigJam

Machen Sie Ihre FigJam Brainstorming-, Ideenfindungs- und Zusammenarbeitssitzungen mit direktem Zugriff auf 100.000+ kostenlose und 400.000+ Premium-Lottie-Aufkleber noch lustiger und aufregender.

Private animations
Private animations

Greifen Sie auf Ihre privaten Dateien und die Animationsbibliothek Ihres Teams zu

Sie können jetzt Ihre privaten Dateien einfügen und die gemeinsame Bibliothek Ihres Teams in Ihre Figma-Designs integrieren, um einen effizienteren und kollaborativeren Arbeitsablauf zu ermöglichen.

Export animation
Export animation

Animationen für Ihre Marke anpassen

Wenden Sie beliebte Farbpaletten an oder passen Sie Ihre Farben an, um Ihrem Markenstil und Ihrer Ästhetik zu entsprechen.

LottieFiles für Figma Entwicklermodus

NEU

Schiffanimationen schnell und bequem

Greifen Sie problemlos auf die Asset-Links Ihrer Animationen zu und erhalten Sie die automatisch generierten Einbettungscodes direkt in Figma, um sie im Handumdrehen zu versenden.

Ship animations quickly and conveniently
Ship animations quickly and conveniently
VS Code Support
VS Code Support

VS Code Unterstützung

Entwickler können jetzt Animations-Links und Codes direkt in VS Code zugreifen. Kein ständiges Hin- und Herschalten mehr zwischen Figma und VS Code!

Player Controls
Player Controls

Player Steuerung

Passen Sie Animations-Einstellungen wie Wiedergabemodus, Richtung, Geschwindigkeit und mehr an und generieren Sie den Einbettungscode mit nur wenigen Klicks.

Automatic enabling of asset links
Automatic enabling of asset links

Automatisches Aktivieren von Asset-Links

Vergessen Sie das lästige Umschalten zwischen Ihrem Arbeitsbereich und den Figma-Designs. Die Asset-Links von Arbeitsbereichsanimationen werden automatisch aktiviert, wenn sie über LottieFiles für Figma eingefügt werden.

Full preview of animations
Full preview of animations

Vollständige Vorschau der Animationen

Sie können Ihre ausgewählten Animationen in voller Bewegung vorab anzeigen, um eine ziemlich genaue Vorstellung davon zu bekommen, wie sie aussehen und sich verhalten werden, sobald sie veröffentlicht sind.

Ship animations as Optimized dotLottie or Lottie JSON
Ship animations as Optimized dotLottie or Lottie JSON

Schiffsanimationen als optimiertes dotLottie oder Lottie JSON

Sie können wählen, Ihre Animationen im optimierten dotLottie- oder Lottie JSON-Format zu versenden, um sicherzustellen, dass Ihre Dateien super winzig sind und blitzschnell geladen werden.

Starten Sie in 3 einfachen Schritten

Step 1

Installieren und ausführen des Plugins

Step 2

Suchen oder erstellen Sie Ihre eigene

Suchen Sie nach Animationen über die Registerkarte „Entdecken“ der Arbeitsbereiche. Oder erstellen Sie Ihre eigene Animation mit der Registerkarte „Figma zu Lottie“.


Für das Plugin Dev Mode wählen Sie eine Animation aus einem Ihrer Arbeitsbereiche aus, um zu beginnen.

Step 3

Fügen Sie Ihre Animation ein oder inspizieren Sie diese

Öffnen, personalisieren und fügen Sie Ihre Animation als GIF auf der Figma-Leinwand ein.


Für das Dev Mode-Plugin wählen Sie Ihr gewünschtes Dateiformat und kopieren Sie den Asset-Link der Animation oder den automatisch generierten Einbettungscode, um ihn zu versenden.

Erfahren Sie alles über die Erstellung von Animationen in Figma und lassen Sie sich zertifizieren!

Design teams love LottieFiles

Airbnb

"Instead of spending dozens of hours learning Xcode or Android studio, I use LottieFiles to test and share. Now I use those hours to make my animations as dope as I can."

Salih Abdul-Karim
Lead Motion Designer at Airbnb

Salih Abdul-Karim, Lead Motion Designer at Airbnb