Lottie Styler

Lottie Styler serves as a comprehensive monorepo for Lottie theming tools. Our aim is to revolutionize the way designers and developers work with Lottie animations, equipping them with the tools to alter animation properties dynamically. This repository houses a range of tools, including the relottie ecosystem, to streamline and enrich the Lottie theming experience.

Features

Dynamic Customization: Adjust animation properties on-the-fly, ensuring responsive and high-performance animations. Comprehensive Integration: Designed to work seamlessly with the relottie ecosystem and other Lottie-related tools. Versatile Styling Properties: Supports a broad spectrum of styling properties for comprehensive theming.

Packages

• relottie-style: A relottie plugin that processes the Lottie animation JSON and applies the LSS, using a CSS-in-JS approach for styling.

Follow the specific README.md for each package for more detailed usage instructions.

Demo

// TODO: Add demo link

Contributing

We employ changesets to curate a changelog for this repository. If you modify the codebase in ways that influence functionality or performance, it's imperative to include a changeset.

To add a changeset, execute:

pnpm changeset add

Follow the guided prompts to describe your amendments. Commit your modifications and the changeset to your branch, then initiate a pull request on the develop branch.

Explore Our Other Lottie-related Libraries

• dotlottie-js: Creation tool for dotLottie animations
• dotlottie: dotLottie animation players
• lottie-player: A web component for the Lottie Web player.
• lottie-react: A React component for the Lottie Web player.
• lottie-vue: A Vue component for the Lottie player.
• svelte-lottie-player: Lottie player component for use with Svelte.
• jLottie: jLottie is suitable as a general-purpose Lottie player, though it implements a subset of the features in the core player. This approach leads to a tiny footprint and great performance.
• lottie-interactivity: This is a small library to add scrolling, cursor interactivity, and interaction chaining to your Lottie animations.
• lottie-js: The library consists of methods to map the Lottie JSON to the object model and interact with properties, as well as manipulate them.

License

MIT License © LottieFiles.com