Text-To-Lottie

Generate and preview Lottie animations from text prompts using an LLM within a local, hot-reloading development environment.

Generate and preview Lottie animations from text prompts using an LLM within a local, hot-reloading development environment.

The gist

Text-To-Lottie is an open-source project from Diffusion Studio for generating Lottie animations from text prompts. It provides a developer environment with a full-screen Lottie player and a React-based control surface. The tool is designed to integrate with large language models, allowing a developer to write a prompt, have an agent generate the Lottie JSON file, and see the animation update instantly in the browser via hot-reloading. This simplifies the workflow for AI-assisted animation creation.

What it does

  • Generates Lottie animation files from text prompts via an LLM.
  • Provides a full-screen Lottie player built with Skia CanvasKit.
  • Includes a React and TypeScript control surface for interaction.
  • Watches for changes to the Lottie JSON file and hot-reloads the animation.
  • Integrates with code-generating agents like Claude through npx skills.

How it works

Architecture Diagram
Text-To-Lottie Architecture Diagram

A developer runs the tool as a local web server using npm. The user provides a text prompt to a compatible LLM agent, which generates and saves a lottie.json file. The application's dev server automatically detects the file change and hot-reloads the animation in the browser-based player. This open-source tool is a self-contained development environment for creating Lottie animations without manual coding of the JSON structure.

Best for

This tool is best for developers and designers who want to rapidly prototype Lottie animations using text prompts and an LLM, providing an instant feedback loop for generative animation.

Watch out for

This is a developer tool, not a polished, standalone web application. Using it requires familiarity with running Node.js projects from the command line and integrating with a separate LLM agent.