Lecteur Lottie
Lecteur Lottie gratuit en ligne. Ouvrez toute animation Lottie JSON, lisez-la, scrubbez image par image, changez la vitesse, activez la boucle et prévisualisez sur damier transparent — dans votre navigateur.
Qu'est-ce qu'un fichier Lottie ?
Un fichier Lottie est un export JSON d'une animation vectorielle, généralement créé dans After Effects avec le plugin Bodymovin ou dans des outils comme LottieFiles. Les apps et sites le lisent avec un moteur léger plutôt qu'une vidéo : le fichier est minuscule et la qualité parfaite à toute échelle.
Comment prévisualiser une animation Lottie ici ?
Cliquez sur la zone de dépôt ou faites glisser votre fichier .json dessus. L'animation se charge instantanément et se lance. Le bouton d'exemple permet aussi d'essayer le lecteur avec un échantillon intégré.
Mon animation est-elle envoyée sur un serveur ?
Non. Le fichier est lu et rendu entièrement dans l'onglet du navigateur. Rien n'est transmis, ce qui convient aux projets clients non publiés et aux éléments confidentiels.
Quels contrôles de lecture sont disponibles ?
Lecture et pause, bouton de redémarrage, bascule de boucle, curseur d'images maniable et sélecteur de vitesse de 0,25x à 2x. L'affichage indique l'image courante, le total et la fréquence d'images de l'animation.
Pourquoi un fond en damier ?
Le damier simule la transparence, comme dans les outils de design. Il sert à vérifier que votre animation n'a pas d'arrière-plan indésirable ; passez en blanc ou en noir pour contrôler bords, lueurs et ombres sur surfaces claires ou sombres.
Quelles versions de Lottie sont prises en charge ?
Le lecteur utilise le moteur lottie-web, compatible avec les JSON Bodymovin à partir de la version 4 : calques de forme, masques, mattes, trim paths et la plupart des expressions précalculées à l'export.
Cela fonctionne-t-il sur mobile ?
Oui. La mise en page est responsif et le rendu utilise le même moteur SVG, donc cela tourne sur les navigateurs iOS et Android. Les contrôles sont dimensionnés pour le tactile.
Quelle différence entre .json et .lottie ?
Le format .lottie (dotLottie) est une archive zip qui peut contenir le JSON avec des ressources et plus encore. Cette visionneuse ouvre directement le .json Lottie standard ; pour un fichier dotLottie, extrayez d'abord le .json qu'il contient.
Pourquoi mon animation rame ou s'affiche mal ?
Les animations avec beaucoup de calques, d'images ou d'expressions sont exigeantes à rendre. Vérifiez que les images ne sont pas exportées à part, simplifiez la composition ou réduisez la vitesse : l'affichage FPS montre la cadence prévue de l'animation.
Comment utiliser Lecteur Lottie
Ce lecteur Lottie lit les animations Bodymovin JSON entièrement dans votre navigateur avec le moteur de rendu lottie-web. Chargez un fichier ou déposez-le, contrôlez la lecture image par image et prévisualisez sur fond transparent, blanc ou noir — rien n'est envoyé nulle part.
- Cliquez sur la zone de dépôt ou faites glisser un fichier .json Lottie dessus ; l'animation se charge et démarre immédiatement.
- Utilisez le gros bouton lecture/pause et le bouton de redémarrage pour contrôler la lecture.
- Faites glisser le curseur d'images pour aller à n'importe quelle image ; l'affichage indique l'image courante, le total d'images et les FPS.
- Choisissez une vitesse entre 0,25x et 2x, et activez le bouton de boucle pour une lecture en continu.
- Basculez le fond entre damier transparent, blanc et noir pour inspecter les bords, les lueurs et les ombres.
Appuyez d'abord sur le bouton d'exemple pour voir comment se comporte le lecteur avant de charger votre propre animation — pratique quand un client vous envoie un JSON et qu'il faut vérifier vite.
Outils associés
- Visionneuse et Éditeur SVG Prévisualisez, modifiez et optimisez les fichiers SVG en ligne. Aperçu en temps réel, édition de code et outils d'optimisation.
- Visualiseur d'arbre JSON Visualisez les données JSON sous forme d'arbre repliable interactif. Recherchez clés et valeurs, suivez le JSONPath au survol et gérez les gros fichiers avec chargement différé. Glisser-déposer de fichiers .json pris en charge.
- Générateur de Sprite Sheet Combinez des images en sprite sheet avec glisser-déposer pour réorganiser, mise en page en grille, remplissage, modes d'échelle. Exportez en PNG/WebP/JPG avec données JSON atlas pour moteurs de jeux et CSS.
- Image en Base64 Convertissez des images en chaînes Base64 et décodez Base64 en images. Prend en charge PNG, JPG, GIF, WebP, SVG, BMP, ICO. 100% dans le navigateur, sans envoi.
- GIF Extraire Images Extrayez et téléchargez des images individuelles d'animations GIF en PNG ou sprite sheet. Outil en ligne gratuit avec aperçu et exportation ZIP.
- GIF Inversé Inversez l'ordre de lecture des animations GIF gratuitement en ligne. Importez, prévisualisez et téléchargez instantanément.
- Modificateur de Vitesse GIF Modifiez la vitesse d'animation GIF en ligne. Accélérez ou ralentissez les fichiers GIF instantanément.
- Vidéo en GIF Convertissez une vidéo en GIF animé en ligne. Ajustez la qualité, le débit d'images et la résolution directement dans votre navigateur sans téléchargement.