Lottie

Lottie is an open source animation file format and rendering ecosystem created by Airbnb that enables designers to ship complex, high-quality animations across web, iOS, Android, React Native, and Windows platforms from a single JSON-based source file. The format has become the industry standard for vector animations in mobile and web applications, replacing GIF, PNG sprite sheets, and MP4 videos with resolution-independent, infinitely scalable, and tiny file size alternatives. A typical Lottie animation file is under 10 kilobytes while delivering the visual fidelity of a megabyte-sized video. The workflow integrates directly with Adobe After Effects through the Bodymovin plugin, which exports timeline-based compositions including keyframe interpolation, shape layers, masks, trim paths, and gradient fills into the JSON format. The LottieFiles marketplace provides thousands of free and premium animations contributed by the community, along with the Lottie Editor for visual customization of colors, speed, and timing without returning to After Effects. Platform-specific player libraries include lottie-web for vanilla JavaScript, lottie-react for React applications, lottie-react-native for mobile, lottie-android for native Android with Java and Kotlin, and lottie-ios for native iOS with Swift and Objective-C. Advanced features include dynamic text and image replacement at runtime, marker-based playback control for segmented animations, expression support for programmatic property binding, and performance optimization through hardware-accelerated rendering. The format is widely adopted across the industry with Google, Microsoft, TikTok, Slack, Uber, Instagram, and Discord shipping Lottie animations in their products.