One canvas. Text, image, video and real code — connected.
Every generation lives as a node. Fan out variants, wire them together, layer code-made titles on AI video, and ship the result as MP4 or React.
Motn is not a timeline editor. It's an infinite, multiplayer canvas where AI generations — images, video clips, copy, and real React code — live as connected nodes. Generate in parallel, compare side by side, feed one result into the next, and export anything as video or code. This page shows how.
Describe. Iterate in parallel. Ship.
Every Motn workflow is the same three moves — a prompt goes in, variations land side by side, and the one you pick leaves the canvas as video or code.
Describe
Type what you want into a node. Plain language — the style, the content, the energy.
Iterate in parallel
Generate variants at once. They land side by side — compare, pick, fork again.
pick
Ship
Export the pick as MP4 for social, real React code for your site, or a public link for the client. Watermark-free, yours commercially.
Every node does one thing. Together they do anything.
Generators make images, video, and code. Context nodes carry your brand and your team's Kit. Connect them and the context flows — that's the whole system.
Real 60fps animation written as React code — embed it or export as video.
40 tokensAI images with Gemini, GPT-Image, or Recraft — assets or visual references.
15–50 tokensAI video with Kling 3 Pro, Seedance 2.0, or Veo 3.1 — with native audio.
200–1,000 tokensPaste your URL — colors and fonts are extracted and applied everywhere.
contextYour team's shared library — logos, fonts, colors, and reusable nodes, in every project.
libraryEvery animation exposes live sliders — text, colors, timing — retune without regenerating.
freeSequence clips and animations into one timeline-free export.
assemblyText animation and background presets — proven starting points, one click.
presetsHover a node to see what it connects to — connections are how context flows on the canvas.
Other tools output pixels. Motn also outputs code.
Behind the Code Motion node is a real rendering engine: WebGL, three.js, and the motion library — generated as React components that run at 60fps in any browser. Kinetic titles, video effects, and overlays that used to mean an After Effects license are now one prompt. And because it's code, it's editable forever.
export default function MotnAnimation() {const _c = {bgColor: "#F4F1EC", leftChar: "R", rightChar: "2",pillWidthRatio: 0.62, pillHeightRatio: 0.48,}const frame = useCurrentFrame()const { width, height } = useVideoConfig()// aspect-aware: one component, every canvas formatconst isPortrait = height / width > 1.15const layoutRef = Math.min(width, height, width * 0.5625)// hard-coded pill schedule — each reveals a clipconst PILLS = [{ start: 170, end: 290, src: 0, startFrom: 240 },{ start: 362, end: 482, src: 1, startFrom: 240 },]return (<AbsoluteFill style={{ background: _c.bgColor }}>{PILLS.map((p) => (<OffthreadVideo src={SOURCES[p.src]} startFrom={p.startFrom} />))}</AbsoluteFill>)}
three.js + WebGL
3D scenes, shaders, and particle systems — first-class outputs
60fps React components
not rendered frames — live code running in the browser
Babel in the browser
generated JSX compiles instantly, no build step
Time control
pause, seek, and scrub any animation — timers are patched under the hood
Remotion Lambda
cloud-rendered MP4s when you need a video file
Framer + HTML export
the same component drops into any site, zero dependencies
Made in Motn.
Every tile below is a real template from the library — remix any of them and the full node structure opens in your canvas, prompts included.
One canvas, the whole team on it.
Motn is multiplayer the way design tools are supposed to be: everyone in the same canvas, live cursors, shared libraries, and a history you can always walk back. And when the master is locked, one click re-composes it for every size — the square and vertical cuts below are the same R2 title, adapted by the AI.
master locked — need 1:1 + 9:16 for the campaign by 4
Live multiplayer canvas
Figma-style cursors, per-node locks, and cursor chat — press “/” and type at your pointer. Up to 20 editors in one canvas.
Every size in one click
Lock the master, pick 1:1 and 9:16, done. The AI re-composes the layout for each canvas — nothing is cropped or squeezed.
Shared Kit library
Logos, colors, fonts, and reusable nodes — saved once, available in every project, promotable to the whole team.
Version history
Every save is a snapshot. Go back to any iteration, compare, restore — nothing is ever lost.
Branch in one click
Remix any canvas — yours, a teammate's, or a community template — into a fresh copy with the full node structure intact.
Share anywhere
A public link shows the live canvas to anyone — clients, stakeholders, social — no account needed.
If your work needs to move, this is for you.
Motn is built for marketers, founders, agencies, creators, and developers — anyone shipping motion for social, ads, YouTube, websites, or pure art.
Ads and social that stop the scroll — batches of on-brand variants, exported straight to MP4.
One canvas per client brief. Brand node wired to everything, dozens of directions in one session.
The market does one thing well. Motn connects all of it.
Some tools generate incredible video. Some generate incredible images. Some orchestrate workflows across hundreds of models. Motn combines the best of all three — and adds something none of them have: a node that writes real code.
Video generators
Stunning clips from a prompt.
One output at a time. Pixels you can't edit after the fact.
Image generators
Beautiful stills, instantly.
A still is where the story stops — nothing moves, nothing ships interactive.
Workflow orchestrators
Hundreds of models on one canvas.
Great plumbing — but the final output is still just media files.
Images, video, text, and code — as connected nodes in one multiplayer canvas. When you connect everything together, that's where the magic happens.
- Real React & WebGL code as an output — editable forever, embeddable anywhere
- Multiplayer canvas with live cursors, locks, and shared team libraries
- Brand context wired once, applied to every generation
- Watermark-free commercial use on everything you make
- Tokens roll over monthly — no use-it-or-lose-it
Use it on the website. Put the code in prod. Post it on social.
One canvas, four ways out — and everything is watermark-free and yours to use commercially, no attribution required.
Standalone HTML
Self-contained file, runs in any browser. Embed it on a site, drop it in an email, send it to a client. Zero dependencies.
React component
Raw .tsx you can read and edit — drop it into Next.js, React, or Framer. The animation runs natively, no iframe.
MP4 video
Cloud-rendered video for social, ads, presentations, or anywhere a video file is expected.
Public canvas link
A live, view-only link to the whole canvas — anyone can watch the animations without a Motn account.