remotion-mcp-server

An MCP (Model Context Protocol) server that creates Remotion animations on the fly, stores the MP4s locally, and lets you browse + download them from an interactive MCP App UI.

No AWS / Remotion Lambda required. Rendering uses Remotion’s local SSR APIs (bundle() → selectComposition() → renderMedia()).

Prerequisites

• Node.js 18+

• pnpm

• Enough disk + CPU for Chromium-based Remotion renders (first render downloads a browser binary via @remotion/renderer)

Related MCP server: hyper-video-service

Setup

cd mcp/apps/remotion
pnpm install
pnpm dev

Optional: preview templates in Remotion Studio:

pnpm studio

The server listens on port 3000:

Environment Variables

Templates

Call list_templates for the full prop schema. Templates live under composition/templates/ — add your own Remotion compositions there and register them in composition/Root.tsx.

MCP Tools

list_templates

Describe available compositions and their props.

render_animation

Render a template to MP4 with the given props. Returns an asset record including downloadUrl (/files/<id>).

Example props

• TitleCard: template=TitleCard, title, subtitle, accentColor

• KineticText: template=KineticText, text="Ship faster with Remotion"

• LowerThird: template=LowerThird, name, role

The first call bundles the Remotion project (can take ~30–60s). Later renders reuse the in-memory bundle.

list_assets

List previously rendered animations + download URLs.

get_download_url

Resolve a single asset ID to its download URL.

browse_assets

Open the gallery UI: video previews, filter by template, Download / Open.

Resources

ui://remotion/assets

MCP App resource used by browse_assets.

Client Configuration

{
  "mcpServers": {
    "remotion": {
      "type": "streamable-http",
      "url": "http://localhost:3000/mcp"
    }
  }
}

How it works

1. Templates — small Remotion compositions in composition/, parametrized via input props.

2. Bundle once — bundle() from @remotion/bundler on startup / first render.

3. Render — selectComposition()

   • renderMedia() write data/renders/<id>.mp4.

4. Serve — Express exposes /files/<id> with Content-Disposition: attachment.

5. Browse — browse_assets embeds the gallery as an MCP App.

Renders are stored under data/ (gitignored). Delete that folder to wipe the library.