Mosso fits into the tools you use

Copy designs from Figma as SVG and animate them in Mosso.

1. Select your layers in Figma.
2. Right-click, choose Copy as, then Copy as SVG.
3. Paste into Mosso to animate the shapes.

Export a GIF or MP4 from Mosso and upload it to your design.

1. Open an animation in the Mosso editor.
2. Export it as GIF or MP4.
3. Upload the file to your design.

Export a GIF or MP4 from Mosso and upload it to your design.

1. Open an animation in the Mosso editor.
2. Export it as GIF or MP4.
3. Upload the file to your design.

Add a GIF or MP4 to WordPress, or use a Lottie plugin or an allowed custom embed.

1. Quickest: export MP4 or GIF and add it with a Video or Image block.
2. For a sharp Lottie, export Lottie JSON and paste the HTML code from Mosso's export window into a Custom HTML block.
3. Upload the .json file to your site next to it. WordPress needs a plugin that allows JSON or SVG uploads.

Export Lottie JSON and check it in Webflow.

1. Export Lottie JSON from Mosso.
2. In Webflow, open the Add panel and find Lottie animation under Media.
3. Drag it onto the page, upload your file and turn on Loop.

Export Lottie JSON and check it in your Framer player.

1. Export Lottie JSON from Mosso.
2. In Framer, open Insert, search for Lottie and drop it on the page.
3. Upload your file in its properties and turn on Loop.

A component, ready to paste. Mosso writes it for you when you export.

1. Export Lottie JSON and put the file next to your component.
2. Install the player and use the component from the export window.

npm install lottie-react

import Lottie from 'lottie-react';
import animation from './spinner.json';

<Lottie animationData={animation} loop />

Play Mosso animations in iPhone and iPad apps, in SwiftUI or UIKit.

1. Export Lottie JSON, or dotLottie for compressed animation data.
2. Add the Lottie for iOS package to your project with Swift Package Manager.
3. Add the file to your app and show it with a Lottie view. Loop it for loaders.

Play Mosso animations in Android apps.

1. Export Lottie JSON and put it in res/raw.
2. Add the Lottie for Android library to your app.
3. Drop a LottieAnimationView into your layout:

<com.airbnb.lottie.LottieAnimationView
    android:layout_width="120dp"
    android:layout_height="120dp"
    app:lottie_rawRes="@raw/spinner"
    app:lottie_autoPlay="true"
    app:lottie_loop="true" />

Make and edit animations with the mosso-mcp npm package on your computer.

1. Open Settings, Developer, Edit Config in Claude Desktop.
2. Add the mosso-mcp setup from the guide, then quit and reopen Claude Desktop.
3. Ask for an animation and export a Mosso project file to edit here.

Run mosso-mcp locally and ask Claude Code to make an animation.

1. Install Node.js 20 or later, including npm.
2. Run the command below, then check the connection with claude mcp list.
3. Ask for an animation and save it in your output folder.

claude mcp add --scope user --transport stdio mosso -- npx -y mosso-mcp@0.1.0 --output-dir ~/Mosso

Ask for an animation while you build, and the file lands in your project.

1. Add Mosso to .cursor/mcp.json in your project.
2. Set the output folder to your project folder, then ask it to save the animation in public/.

{"mcpServers":{"mosso":{"command":"npx","args":["-y","mosso-mcp@0.1.0","--output-dir","~/Mosso"]}}}

Drop Mosso animations into After Effects compositions.

1. Export PNG frames from Mosso with the background turned off, and unzip them.
2. In After Effects, choose File, Import, File, pick the first frame and tick PNG Sequence.
3. Drag it into your composition. The background stays see-through.

Put titles, lower thirds and overlays on your footage.

1. For an overlay, export PNG frames with the background off and unzip them.
2. In Premiere, choose File, Import, pick the first frame and turn on Image Sequence in the options.
3. For a full-screen piece, an MP4 export is all you need.