Edit Lottie files layer by layer, in 3D.

Drop a .json or .lottie file on the canvas and it comes in as Paraplex layers: vector shapes, groups, text and pictures, with their keyframes and easing. Change anything, restyle it with real materials, light and a camera, then send the flat parts back out as a Lottie any player plays, or export the whole scene as MP4, WebM, GIF or a live embed.

Lottie import and export in your browser. Free to start, nothing to install.

Chrome logo reveal template made in Paraplex: a flat logo mark turns out of the dark as beveled chrome, lit like a studio, before the name closes in beside it

From Lottie file to finished scene.

Paraplex reads a Lottie into the same layers you'd draw by hand, so nothing in it is locked.

Drop

Drop the file in.

Drop a .json or .lottie file on the canvas or open it from Menu › Import Lottie…, or let the assistant bring one in from a link.

Edit

Every layer, every key.

Shapes, groups, text and pictures arrive with their keyframes and easing, ready to retime, recolor and rewrite.

Stage

Give it depth and light.

Depth, bevels and materials such as glass or chrome, lit in a real 3D scene and filmed by a camera you can move.

Export

Send it back out.

The flat parts as a Lottie again, or the whole scene as MP4, WebM, GIF, a PNG sequence or a live embed.

Lottie in, layers out.

Drop a .json or .lottie file on the canvas, or open it from Menu › Import Lottie…, and Paraplex reads it into native layers, nested the way it was built: vector shapes, groups, text and pictures, each with its keyframes and easing. It isn't a sealed clip you can only scale and loop. It's a scene you can take apart.

Anything the file uses that can't come across is listed for you rather than silently dropped: expressions, effects, masks, mattes and repeaters stay behind, so you know what to rebuild.

Only need a video of a Lottie? Use the free Lottie to MP4 tool.

Change any layer, any key.

Select a layer and change it the way you'd change anything drawn in Paraplex: recolor a shape, rewrite a word, edit a path's anchors, or drag its keyframes to retime it. Swap an easing for one of Paraplex's curves or springs, or ask the AI assistant to make the change and Apply it when it looks right.

The Lottie's layers sit in the Layers panel like any others, so you can group, hide or isolate them, or select several and change them at once.

Flat vectors, real light.

Every Paraplex scene is real 3D, and a Lottie's shapes become part of it. Give a closed shape depth and a bevel, put it in glass, chrome or one of 21 one-click material looks, and light it with studio lights or an HDRI so the highlights travel as it moves.

Then add what a Lottie never had: a camera move, a reflective floor, particles or a backdrop, all in the same scene and all keyframeable.

More on materials and light: 3D motion graphics.

Glass cards template made in Paraplex: three flat pricing cards rendered as clear glass spring up over a dark gradient, bending the light and the cards behind them as the camera arcs around

Back out as Lottie, or as video.

Menu › Export Lottie… writes the flat parts of a scene, shapes, text, pictures and groups with their keyframes and curves, as a Lottie any player plays, ready for an app, a site or a handoff. Lottie has no room for lights, 3D, models, particles, effects or camera moves, so those stay out of the file, and Paraplex tells you which.

When the 3D is the point, export the whole scene instead: MP4, WebM, GIF or a PNG sequence, in every aspect ratio from one scene, or transparent WebM to lay over a page or an edit. Or publish it as a live embed that answers hover, click and scroll.

With no background behind it: transparent video export.

Templates built from logos, UI and type.

Lottie work is mostly logos, icons, interface and type. These templates start from the same kind of shapes, then add what a Lottie file can't hold: depth, light and a camera. Drop a Lottie into any of them.

The Lottie editor, at a glance.

Opens Lottie .json and .lottie files

Shapes, groups, text and pictures as native layers

Export Lottie, MP4, WebM, GIF or PNG sequence

Every aspect ratio from one scene

Glass, chrome and 21 one-click material looks

Keyframes and easing kept, ready to retime

Anything that can't cross over is listed, not dropped

Your AI agent can send Lottie files in too

Questions about the Lottie editor

How do I edit a Lottie file online?

Open Paraplex in your browser and drop the .json or .lottie file on the canvas, or open it from Menu › Import Lottie…, and it comes in as layers: vector shapes, groups, text and pictures, with their keyframes and easing. Select any layer to change its color, words, shape or timing, then export it as a Lottie again or as a video.

Does it open .lottie files as well as JSON?

Yes. Paraplex imports Lottie animations saved as .json files and as .lottie files. Drop either on the canvas, or drop several files at once and each finds its own place.

What doesn't come across from a Lottie?

Expressions, effects, masks, mattes and repeaters are left out on import. Paraplex lists anything it leaves out instead of dropping it silently, so you know what to rebuild. If an animation leans heavily on those, keep editing it in the tool it was built in.

Can I export my animation as a Lottie?

Yes. Menu › Export Lottie… writes the flat parts of a scene, shapes, text, pictures and groups with their keyframes and curves, as a Lottie any player plays. Lottie can't carry lights, 3D, models, particles, effects or camera moves, so those are left out and listed.

Can I turn a Lottie into a 3D animation?

Yes. An imported Lottie's shapes are ordinary layers in a real 3D scene, so you can give them depth, bevels and materials such as glass or chrome, light them, and move a camera around them. Export the result as video or a live embed; the 3D can't go back into a Lottie file.

How do I convert a Lottie to MP4?

Import it, then export MP4, WebM, GIF or a PNG sequence from the scene, in any aspect ratio, or transparent WebM with the background turned off. If you only need the conversion, the free Lottie to MP4 tool does it in one step in your browser.

Can AI work with my Lottie files?

Yes. Paraplex's AI assistant can bring a Lottie in from a link, and an AI agent connected through the Paraplex MCP server, such as Claude Code, can send Lottie files into your open scene. Once a Lottie is in, the assistant edits its layers like any others, and each change waits for your Apply.

Can I put the edited animation on my website?

Yes, two ways. Export it as a Lottie and it plays in any Lottie player. Or publish the scene as a Paraplex embed, which keeps the 3D, light and camera and answers hover, click, drag and scroll.

Is the Lottie editor free?

Yes. Lottie import and export are on every plan, including Free, and the free plan exports MP4 at 1080p and 30 fps with no watermark. Pro adds exports up to 4K at 60 fps.

Your Lottie, opened up.

Drop it into Paraplex, change anything, light it in 3D and send it back out, all in your browser.

Paraplex is a browser-based 3D motion design studio with an AI assistant that edits real layers and keyframes.

01

Describe it.

One or two sentences on this way to start.

Open Paraplex
A screenshot depicting artboards in Paraplex, the 3D motion design web app, which allow you to export multiple media formats and sizes with one click, automatically formatted for different social media platforms.

Brand and social

Video ad variations

One version per spreadsheet row: columns fill headlines, prices and photos by layer name, and Export all variants renders them in one job (Pro).

Three ways to start.

Whatever the job, a project starts from words, from a finished template, or from the files you already have. All three open in the same editor, and you can mix them in one scene.

01

Describe it.

Type what you want on the home page and click Make it. The assistant builds the scene from real layers and keyframes, and you Apply or Discard what it made.

Describe a scene

02

Open a template.

62 finished templates in 13 categories, each built for you to swap in your words, pictures, logo, colors, data, music, video or voice.

Browse templates in Paraplex

03

Bring what you have.

Drop screenshots, recordings, GLB models or Lottie files on the canvas, paste an SVG from Figma or HTML and React as a live layer, or upload a CSV for a chart.

Start with a blank scene

One scene, every screen.

Whatever the job, the same scene exports for every place it runs. Add formats as artboards beside your frame, let Responsive framing re-stack blocks for each shape, and pin your logo to its corner. Then export MP4, WebM, a GIF or a Lottie, or publish a live embed for your site.

Export to

5 shapes

16:9, 9:16, 1:1, 4:5 and 4:3, or a custom size

Safe zones for

4 feeds

TikTok, Reels, Shorts and the Instagram feed

Up to

4K at 60 fps

on Pro; free exports run to 1080p, no watermark

Landscape 16:9 · YouTube, slides and your site

Vertical 9:16 · Reels, Shorts & TikTok

Portrait 4:5 · feeds on Instagram, X and LinkedIn

Render needed · FR-03

Paraplex for

Marketers

Every channel wants its own cut. Build one scene, reframe it for 16:9, 9:16, 1:1 and 4:5 with safe zones for each feed, and keep every version on brand with a design system.

Eight types of charts against a black background: Bar chart showing vertical bars for days Mon-Fri; Line chart plotting connected points for days; Area chart filled beneath a line for days; Pie chart divided into colored segments labeled by day; Donut chart similar to pie but with a hollow center; Scatter plot with dots of varying sizes; Gantt chart with horizontal bars labeled Research, Design, Build, Launch; Timeline with labeled milestones Founded, First product, Series A, Worldwide.

Render needed · FR-04

Paraplex for

Agencies

Every client has a brand, and every brand has revisions. Keep each client's colors, fonts and motion as a design system, apply it in one step, and share a link for review.

Your brand in one step.

Keep colors, fonts, text styles, materials, scene looks and motion as a design system, and apply it to any scene at once.

Video, Lottie or a live embed.

Export MP4, WebM, GIF, PNG or Lottie, or publish an embed that plays in real time on your site and answers hover, click and scroll.

Question

Answer.

App launch (your UI) template: the camera pushes in on the input of an app interface pasted in as HTML, then eases back out to a tagline
App launch template: a question types into an app window, an answer streams in, steps slide in and a chart grows
Liquid glass nav template: a liquid glass bar bends the big headline beneath it, both inside the same Paraplex scene
One Paraplex scene on four artboards: the primary scene beside Landscape 16:9, Square 1:1 and Portrait 4:5, each laid out for its shape

Screenshot · one scene on four artboards

Coming soon: post straight to your accounts.

Not available yet. Two things are on the way for marketing teams. The first is posting finished pieces straight to your linked social accounts.

The second is a long-form YouTube workflow for 3D documentaries, educational videos and tutorials: an outline and research, a voiceover, B-roll and generated 3D scenes, edits timed to the narration with music, sound and titles, landscape and vertical renders for each platform, and titles, descriptions and hashtags written for each post. Both will be listed here when they ship.

The word 'Clarity' in large white text over a black background with abstract light patterns in warm brown on the left and cool blue on the right, showcasing the advanced 3D effects, shaders and materials shown in the Paraplex app including the liquid glass motion design template.

“Every client has a brand.”

A design system per client.

Keep each client's colors, fonts, text styles, materials, scene looks and motion as its own design system in your Library, and apply it to any scene in one step. A client's kit exports as one file to share with a teammate.

“The revisions never end.”

A link for review, a step to undo.

Copy a shareable link that publishes the piece as a web page, then refresh it after each round while the address stays the same. Notes on the canvas never export, undo has no limit, and each project keeps a History of recent saves to restore.

“The volume keeps growing.”

Templates, including your own.

Start from 70+ editable templates that each say what to swap in, or save any scene as a template of your own. Data variants make one version per spreadsheet row, and on Pro, Export all variants renders them in one job.

“Every channel wants its own size.”

One scene, every format.

Add 16:9, 9:16, 1:1, 4:5 or 4:3 as artboards beside the frame, each reframed for its shape, with safe zones for TikTok, Reels, Shorts and the Instagram feed. On Pro, one export renders every enabled format.

The client's own fonts, saved in the project

Light and dark themes, or a brand and sub-brand, in one palette

Beat detection, so cuts land on the drum hits

Notes on the canvas that never export

Transparent WebM and PNG sequences (Pro)

Live embeds the client's site fills in by layer name

AI images and 3D models from a sentence

Components that follow the master's edits

Responsive artboards in Paraplex: one scene laid out in several aspect ratios side by side

Screenshot · responsive artboards

The same Paraplex embed twice on a page, one filling the layer named Headline with Glow, the other with Ember

Screenshot · one embed, filled by name two ways

On brand, in light and dark.

Link layers to your palette and give each color a value per theme. Switch the embed's theme from your page and every linked layer follows, so the scene matches your site in light mode and in dark mode.

Bring the whole design system along, with its colors, fonts, text styles and materials, and apply it to any scene in one step.

The Design systems library in Paraplex: five design systems side by side, each with its colors, text styles, materials and motion tokens and a Use in project button, under Save from this project and Import tokens

Screenshot · your design systems

Your own code, running live inside it.

Code layers bring HTML, CSS, JavaScript or React into a scene, flat over the frame or as a card in 3D. In an embed they keep running and respond to the pointer, so a live counter or a slice of your product's UI can sit inside the 3D scene on your site.

A live HTML card with a gradient heading and a filling progress bar, standing at an angle in a Paraplex 3D scene

Screenshot · a live HTML card in a 3D scene

Camera

A camera they can move.

Let viewers Orbit, Look around like a panorama, Walk with W A S D or two fingers on a phone, or keep the camera Fixed.

States

States, not just a loop.

Idle loops, presses that play once and hold, and held poses, switched by clicks, the pointer, a delay or your page.

Keyboard

Reachable without a mouse.

Every interactive layer gets a keyboard-focusable stand-in, so visitors can reach it with Tab and press it with Enter.

Reduced motion

Calm for anyone who asks.

Visitors who ask their device for less motion see the first frame held instead of the animation.

The Publish as an embed panel in Paraplex: a live embed with its two-line snippet ready to copy, scrolling and viewer options

Screenshot · publishing a live embed

A transparent, irregularly shaped glass tube floating against a smooth, wavy background of blue, beige, black, and white hues, showcasing the 3D rendering, shaders and materials available in the Paraplex app, with customizable properties and animated keyframes, like the liquid glass effect seen in this image.
Particle logo reveal made in Paraplex: thousands of fine particles stream in from a loose cloud and pack into a logo mark on a dark ground
Logo swarm template: a swarm of fine specks packs into a logo until it reads solid, holds as a few flicker warm and cool, then bursts toward the camera
The word 'Clarity' in large white text over a black background with abstract light patterns in warm brown on the left and cool blue on the right, showcasing the advanced 3D effects, shaders and materials shown in the Paraplex app including the liquid glass motion design template.
The word 'Clarity' in large white text over a black background with abstract light patterns in warm brown on the left and cool blue on the right, showcasing the advanced 3D effects, shaders and materials shown in the Paraplex app including the liquid glass motion design template.
An app demo in the Paraplex editor: a browser frame with a cursor whose path and clicks are keyframed on the timeline

Screenshot · a cursor path over a browser frame

The Paraplex editor with a promo made from screens: an app's order-tracking screen on a 3D phone, the callout Live order tracking beside it, and its title and callout layers on the timeline
Product launch template in Paraplex: a 3D phone fills the frame and settles beside a chrome product name
One Paraplex scene reframed for landscape, vertical and square artboards side by side
A live HTML card with a gradient heading and a filling progress bar, standing at an angle in a Paraplex 3D scene

Screenshot · a live HTML card in a 3D scene

The lower half of the Paraplex Menu, with Connect an agent among the import and export items

Screenshot · Menu › Connect an agent

One Paraplex scene reframed for landscape, vertical and square artboards side by side, ready to export in each