Your AI tool can now open your Framer project.
Yes, really.
You probably already use Claude, Codex, or Cursor for writing, code, or planning. Now you can point one of them at your Framer site and ask it to get to work.
What it is? How to connect it? And how to keep control of your site while it works.
Let’s go.
Before that, here's a word from our sponsor:
🚨 Why pay $79–$129 for just one template…when you can get 30+ templates for less? Most “premium” templates lock you into one layout, one style, and zero flexibility. With Pentaclay, you get an ever-growing library that gives you freedom to build websites your way—without extra cost. ✨ What’s inside Pentaclay: • 30+ Framer & Figma templates • 5–7 new templates added every month • Unlimited commercial licenses • Lifetime access available • Priority support
So What Is Framer MCP?
MCP stands for Model Context Protocol. Don’t worry about the name.
Think of it as a plug.
It’s a standard way for AI tools to connect to other apps. Framer MCP is the plug that lets your AI tool connect to Framer.
Once it’s plugged in, your AI can read your project, make changes, and help you publish. You give the instructions. It does the work.
Simple.
What It Can Actually Do
Here’s what you can ask for:
Build and edit pages:
Layouts, sections, styling. Give it a brief and it’ll make a first pass.
Update content:
Text, images, and CMS collections. This is where it saves real time. Nobody enjoys updating 40 blog posts by hand.
Manage supported settings:
The connection covers the project settings Framer allows through MCP. Check the current list in the help article before you rely on it for a specific task.
Publish:
But only when you ask By default, nothing goes live. The AI has to be told to publish.
One rule to remember. The AI can only see projects your Framer account has access to. It works with your permissions, not some special backdoor.
Framer MCP vs. Framer’s Built-In Agent
This is the question I keep getting, so let’s clear it up.
Framer has its own built-in agent. It runs on Framer credits.
You use it inside the Framer editor, and you can read more about it in our Framer Agents guide.
Framer MCP is different. It uses the AI plan you already pay for, like Claude or ChatGPT, or the credits from your Cursor plan.
So the choice is simple.
If you live inside Framer and want everything in one place, use the built-in agent.
If you already spend your day in Claude or Cursor, use MCP. You don’t need to switch tools.
Some people will use both. That’s fine too.
How to Connect Claude, Codex, or Cursor
Setup depends on which tool you use. Here are the quick versions.
Claude:
Open the Framer listing in the Claude Directory
Click Connect to Claude.
A browser tab opens. Sign in to Framer, approve access, and go back to Claude.
Then ask it to connect to your project.
Codex:
Install Framer from the ChatGPT Plugins directory
Approve access in the browser tab that opens. Or add it manually from your terminal with the Framer MCP command.
Cursor:
Add Framer from the Cursor Marketplace.
When prompted, click Authenticate, sign in, and select Allow.
Then go back to your project.
Any other tool: If yours isn’t listed, you can still connect. Add a remote server with the type Streamable HTTP and this URL:
https://mcp.framer.com/mcp
Then sign in when Framer opens in your browser.
The most common mistake is typing the URL slightly wrong. Copy it exactly.
Your First Prompt (Keep It Small)
Don’t start with “rebuild my whole site.”
Start with something easy so you can see the AI can actually find your project.
Give it the full project link. Not just the name. Framer’s own guide says the AI can grab the wrong project if you only give it a name.
Try these:
“List the CMS collections in this project: [your project link]”
“Update the homepage heading to ‘Design and publish without handoff’: [your project link]”
Once that works, you can get more ambitious:
“Open this Framer project and create a responsive pricing page using its existing styles and components: [your project link]”
Notice the pattern.
Specific.
Uses what you already have.
Gives the link.
That’s the whole trick.
Review Everything Before It Goes Live
This is the part that matters most.
Changes stay in your project or on a branch until you publish them.
The AI doesn’t push anything live on its own.
So when it finishes, open Framer. Look at the result on the canvas. Compare it with your live site. Then decide what to keep.
If something’s off, tell the AI what to fix.
For experiments and client work, use a branch. That way your live site stays untouched while you try things out.
And a quick warning from me. If the AI changes your page titles, slugs, or redirects, check them carefully before publishing.
Those things affect rankings, and a bad redirect can hurt you for months. Our Framer SEO guide covers what to watch for.
What Changed From the Old Setup
If you read about Framer’s External Agents before, here’s the update.
Framer now recommends MCP as the main way to connect outside AI tools.
The older External Agents setup, which uses the @framer/agent command-line tool, still works. It’s still the way to go for some workflows, like localization. Framer says both will stay supported while MCP catches up on features.
So if you’re already using the old setup, you don’t need to panic. Just know that MCP is where things are headed.
When Things Go Wrong
Most problems are small. Here’s what to check.
Can’t connect? Double-check the URL. Make sure your AI tool supports remote servers with OAuth. Most current tools do.
Wrong project? Give the full project link, not the name.
Sign-in window closed too early? Just retry the authentication.
Your workspace blocks new connections? Ask your admin. Some teams require approval for plugins and MCP connections.
If you’re stuck, the official setup guide has more detail for each client.
Is Framer MCP Worth It?
Yes, if you already use Claude, Codex, or Cursor every day.
You skip the copy-paste dance between tools. You keep your Framer project as the source of truth. And you still have final say on what goes live.
Start small. Test on a branch. Work up to the bigger stuff once you trust the output.
Ready to connect? Start at framer.com/mcp and follow the setup guide for your tool.
And if you want to learn Framer from the ground up before you bring AI into the mix, our 30-day learning guide is the place to start.
