AI Video in Cursor and Claude Code via MCP

If you ship product, you already know the gap: the feature works, the landing page is written, and now you need a hero video, three app-store shots, and a demo clip for the README. Normally that means a context switch out of the editor, into a separate tool, back with an asset, and a lot of lost focus. This guide closes that gap. Add the 8frame MCP server to Cursor or Claude Code and you generate images and video from the same window where you write code.

The 8frame MCP server exposes image generation, editing, upscaling, and video generation across 16 models. Cursor and Claude Code are both MCP clients, so once the server is in their config, the coding agent can call it like any other tool. You describe the asset in the chat panel, it generates on 8frame's canvas, and the result comes back with a link. Below is the config for each, the dev use cases that actually pay off, and the latency reality so you know when to reach for it and when not to.

What you'll be able to do from the editor

The same capabilities as the canvas: generate a still, animate it, edit an existing frame, upscale a winner. The difference is you're doing it inline with your build. A few things developers reach for most:

• App store and Play Store preview clips to accompany a release.
• README and docs demo videos that show a feature in motion.
• Landing page hero videos for the marketing site you maintain in the same monorepo.
• Social launch assets when you ship and need something for the announcement.

Cost is per-generation compute, the canon per-clip pricing: Kling 3.0 at $0.28-0.40 for a 5-second clip, Veo 3.1 at $0.85-1.20 at 4K, Nano Banana Pro stills at $0.04-0.08. No separate MCP fee.

Add the server to Cursor

Cursor reads MCP servers from an mcp.json file: ~/.cursor/mcp.json for a global server available in every project, or .cursor/mcp.json in a repo for a project-scoped one. Add 8frame under mcpServers:

{
  "mcpServers": {
    "8frame": {
      "url": "https://mcp.8frame.co/mcp"
    }
  }
}

Then open Cursor Settings → Tools & MCP, confirm MCP servers are enabled (the toggle defaults off in some installs), and verify the 8frame tools appear. You'll authenticate to your 8frame workspace on first use so generations draw from your account. If you commit .cursor/mcp.json to a shared repo, keep any secrets out of version control and use Cursor's config interpolation for sensitive values.

Add the server to Claude Code

Claude Code adds remote MCP servers over HTTP with one command:

claude mcp add --transport http 8frame https://mcp.8frame.co/mcp

Add --scope user to register it once for all your projects, or --scope project to share it with teammates via the project config. Verify with:

claude mcp list

Once it's listed, ask Claude Code to generate directly in your session. The full server reference and the claude.ai Connectors route (for prompting outside an editor) are at 8frame.co/mcp.

Where this pays off

App store preview shots. You're about to submit a release and need lifestyle b-roll around your screen captures. Ask for a 5-second clip of your product's context (a phone on a desk, a hand reaching for a coffee, whatever frames the app) and drop it into your preview edit. Note that platform stores have real rules about on-device footage, so AI fits the intro, outro, and lifestyle b-roll rather than replacing screen capture.

README demos. A static GIF is fine; a short clip that shows the feature's payoff is better for a launch. Generate it while the feature is fresh in your head, link it in the README, move on.

Landing hero video. If you maintain the marketing site in the same repo (a lot of product teams do), you can generate the hero clip without ever leaving the editor. Iterate on the brief in the chat panel, generate a couple of options, pick one, ship.

Launch-day social. When you cut a release you often want a clip for the announcement thread. Batch three or four vertical variations and you've got a hook-testing set for a few dollars of compute.

A worked example from Claude Code

Say you just merged a feature and want a landing hero. In the Claude Code session:

"Generate a photorealistic 5-second clip, 16:9, of a sleek laptop on a minimalist desk in soft morning light, screen glowing, slow push-in. Then upscale it to 4K."

Claude Code calls the 8frame tool, routes the motion to Kling 3.0 and the finish to the upscaler, and returns a canvas link. Total compute: under $0.50. You reviewed the concept in text, spent one generation, and never opened another app. If you want to name the engine, say "use Veo 3.1" for the premium look at the higher per-clip price.

Sharing the setup with your team

If your whole team works out of the same repo, commit a project-scoped config so nobody has to set it up individually. In Cursor, that's .cursor/mcp.json in the repo root with the 8frame server block above; anyone who opens the project gets the server (they still enable it and authenticate to their own 8frame workspace on first use). In Claude Code, run claude mcp add --transport http --scope project 8frame https://mcp.8frame.co/mcp, which writes the server to the project config your teammates share.

The practical upside is that generating a launch asset stops being "the one person who owns the design tool" and becomes something any engineer can do while they're already in the code. A backend dev shipping an API can cut a demo clip for the changelog without pinging anyone. Keep secrets out of any committed config and use the client's interpolation for sensitive values, the same rule that applies to every other server in mcp.json.

Honest latency and QC notes

It is not instant. These are real generative models. A Nano Banana Pro still comes back in roughly 8 seconds, a Kling clip around 60, a Veo clip around 90. That's fine for an async "generate while I keep coding" loop, but don't expect autocomplete speed. Kick off the generation, keep working, check back.

Review at full resolution on the canvas. The editor chat shows a preview and the link. For anything that ships (a store submission, a public hero), open the canvas and inspect the frame at full size. Generative video still produces the occasional warped detail, and a thumbnail hides it. The canvas is where you do final QC.

The editor is a front door, not the whole surface. Config-driven generation from Cursor or Claude Code is excellent for one-off assets and fast iteration. For a multi-reference composition, precise layout, or a reusable workflow template your team runs repeatedly, the full canvas is the right place. The MCP server gets you 80% of the value without leaving the editor; the last 20% of control lives on 8frame itself.

Related guides

Prefer prompting outside an editor? How to generate AI video from Claude covers the claude.ai Connectors setup. Building an automated system rather than prompting by hand? How to add video generation to your AI agent treats the same MCP server as an agent tool. And if you're new to the protocol itself, what is MCP explains how all of this connects.

---

Add the 8frame MCP server to your editor and generate from where you already work, or open the full 8frame canvas for multi-model composition.