LottieFiles vs Rive
Both are design tools. Here is what separates them.
| LottieFiles | Rive | |
|---|---|---|
| Category | Design | Design |
| Pricing model | freemium | freemium |
| Price from | Freemium | Freemium |
| Upvotes | 18 | 13 |
| What it does | Vector animations that ship as JSON and stay sharp at any size. | Interactive animations with a state machine, shipped as a real runtime. |
What LottieFiles is
LottieFiles is a set of tools for creating, storing and shipping Lottie animations. A Lottie is a JSON based animation file format that can be delivered to any platform as easily as a static asset, and because it is vector based it scales across device sizes without pixelation. The format itself is open source under the MIT licence and not tied to a single vendor. dotLottie is a packaging layer over Lottie JSON, and the documentation covers when to choose each of the two. Lottie Creator is the browser based editor for building and editing these files. It supports keyframes with easing and interpolation, layers, imported assets, nested scenes, trim path, gradient fills, segments and mattes, animates imported SVG files, and handles kinetic typography for text. Its plugins include Duplicator, AI Prompt to Vector and Motion Copilot. For designers working elsewhere, there are plugins for Figma, After Effects and Canva, with the Figma plugin adding raster to vector conversion and an AI prompt to vector tool. Playback is handled by published runtimes for JavaScript, React, Vue, Svelte, React Native, Flutter, iOS and Android. The core web player is on npm, renders both dotLottie and Lottie JSON, and has dedicated wrapper packages for React, Vue, Svelte and Web Components around a framework agnostic core. The dotLottie runtime APIs are TypeScript first, and the web player exposes control over playback, layout, theming, multi animation files and interactive state machines, with documentation covering web worker and GPU rendering options. dotLottie rendering uses the ThorVG graphics library. One caveat is worth knowing before a complex animation is committed to: Lottie does not support every Adobe After Effects feature, and per platform compatibility tables list the gaps. Expressions, images, text glyphs, masks, interpolation, strokes and fills are among the properties supported across platforms. Four plan tiers are sold: Free, Individual, Team and Enterprise. Individual adds private projects and private uploads for solo users. Team is positioned for commercial work by teams of fewer than ten, with a shared workspace and shared team assets. Enterprise is aimed at teams of ten or more and adds SSO, custom permissions, priority support, custom integrations and audit features. Subscriptions are billed annually and there is no standard monthly payment plan. Adding a team member part way through a term triggers an immediate pro rated charge equal to the monthly rate multiplied by the months remaining, though a seat freed by a departing member can be reassigned to a replacement at no extra charge. Premium animations come only with a paid subscription and cannot be bought one at a time. Students and educators over 13 at institutions in 15 supported countries can apply for the Education Plan, a free workspace that runs for a year and renews by repeating the verification. It excludes premium animations and the file optimiser, and forbids commercial use such as advertising, monetised content and paid client work.
What Rive is
Rive is a design tool for interactive animation that combines a vector editor, a timeline animator and an interactivity layer in one application. The file built in the editor is the file that ships in the app. Graphics are drawn by a GPU accelerated vector rendering engine, and the average Rive file is about 43 KB. The State Machine links animations with conditional transitions, so a graphic reacts to user input, screen size, scroll position and application state. Data Binding connects text, colours, layouts and other properties to live application data at runtime, and Events let a Rive graphic notify the host application when a meaningful state change occurs. Text can be replaced at runtime and supports any language, while fonts, images and audio can be loaded as dynamic assets rather than embedded in the file. Responsive layouts let a component reflow and resize to fit its container, and scripting in the Luau language covers custom and procedural behaviour. Rive imports SVG vectors, raster images in PNG, JPEG and WebP, and PSD files with their layers preserved. Animation covers skeletal rigs with bones, inverse kinematics and constraints, plus mesh deformation with vertex weighting. A cloud renderer outputs video, GIF and PNG sequences. Runtimes are published for Web, React, React Native, Flutter, Apple, Android, Unity, Unreal, C++, Defold, Framer, Webflow and Wix Studio, all open source under the MIT licence. The Free plan costs nothing per seat and allows unlimited personal files but only three collaborative files, one project and one workspace. It caps each imported asset at 10 MB and provides no exports, no revision history and no CDN hosting. Cadet is $9 per seat per month for a maximum of three seats, raises the asset cap to 100 MB and lifts the limits on collaborative files, projects and exports, including .riv files. Voyager is $32 per seat per month for up to 25 seats and adds libraries, hosted embed URLs and unlimited revision history. Enterprise is $120 per seat per month and adds unlimited subteam workspaces, custom S3 bucket storage, SSO and SOC 2 Type II. Paid plans can be billed monthly or yearly.
We are not affiliated with either product. Upvote counts come from the published formula and neither position was paid for.