I searched "Framer MCP" before connecting Claude Code to our Mindly template. Half the results told me how to set one up. Framer's own docs told me I don't need one.
So I tested it. Same template, same one-line prompt, run twice: once with nothing extra, once with our Agent Kit loaded. This is the guide I wanted that day: which route to use, what it costs, the commands, and the results side by side.
Short version: connecting takes five minutes. Telling the agent what not to touch is the actual work.
Key takeaways
You don't need a Framer MCP server. Framer's native External Agents connection replaces it.
Setup is two commands and one browser approval.
External agents don't use your Framer AI credits. You pay for your own Claude or ChatGPT plan instead.
Without design rules, Claude Code built a good-looking page and left 5 new components and an edited shared button behind.
With the Agent Kit, the same prompt reused existing components and flagged template bugs before building anything.
Do you need a Framer MCP server?
No. Framer says it doesn't require a separate MCP server. Its own agent connection gives Claude Code, Codex and others access to your canvas, components and CMS.
The confusion comes from an older community plugin that is an MCP. Here are all three routes:
Route | What it is | What you need | Use it when |
|---|---|---|---|
External Agents (native) | Framer's official link to agents on your computer | Node, a terminal agent, one browser approval | You want Claude Code or Codex working in a real project. Start here. |
Framer MCP plugin (community) | A third-party plugin that tunnels MCP into Framer | The plugin open inside Framer, one project at a time | You already rely on it. Otherwise skip it. |
Framer Agent (built in) | The agent inside the Framer editor | Framer AI credits | You don't want a terminal at all. |
What it costs
The connection is free. The AI isn't. Because the model runs in your own tool, Framer itself says it doesn't draw on your Framer credits.
You pay for | How much | Notes |
|---|---|---|
Framer AI credits | Nothing extra | Only the built-in Framer Agent spends them |
Claude Code | A paid Claude plan | The free Claude plan doesn't include Claude Code |
Codex | Your ChatGPT plan | Check your plan's Codex limits |
Your Framer site plan | Unchanged | Same plan you'd publish on anyway |
How to connect Claude Code to Framer
Four steps. I did this on a copy of Mindly, and I'd tell you to do the same: never connect an agent to your live project first.
Start Claude Code in an empty folder. Open your terminal,
cdinto the folder, runclaude.Paste this prompt, with your own project link:
Approve the connection. Framer opens a browser tab asking you to authorise the agent. Click approve. Claude prints a session ID when it's done.
Test with a question, not a build. Ask "What pages are in this project?" If it lists them, you're connected.
That last line of the prompt is there for a reason. Left alone, agents tend to go searching for an MCP that doesn't exist.
One limit to know: external agents can't yet change project names or domains, assign overrides, or read analytics.
What "connected" looks like: two Framer skills installed, connection approved, session ID printed.
Same prompt, with and without the Agent Kit
I gave Claude Code one lazy prompt on two copies of Mindly: "let us build a partnership page, get creative with it." The first copy had only Framer's setup. The second had our Agent Kit loaded.
Honestly, both pages look good. The first one surprised me.
Without the Agent Kit: on-brand at a glance. Note the template's "Get this template" button sitting over the fourth stat.
With the Agent Kit: same prompt, same template.
The difference isn't on the page. It's in what the agent changed in the project:
Without Agent Kit | With Agent Kit | |
|---|---|---|
Before building | Read Framer's guides, studied the homepage | Ran a preflight and audit: all 17 components, 17 tokens and 11 text styles confirmed |
Template's own bugs | Built on top of them | Listed them first (tablet text smaller than phone, a brand colour at 50% opacity, desktop padding on phone) and asked to fix them |
New components | 5 created | 0. "Everything above already exists." |
Shared components | Edited the site's submit button, which still read "Enroll now for $499" | Left the Nav Link alone, because editing it changes every page |
Navbar and footer | Added the link sitewide when asked | Said up front it wouldn't touch them unless told |
Made-up content | Flagged at the end | Flagged before building |
None of this shows on day one. It shows the next time someone edits the site and finds five near-duplicate components and a button that behaves differently on one form. That's what design drift actually looks like.
Watch the full with-kit build: Claude Code builds a partnership page on Mindly with the Agent Kit
So, is it worth the hassle?
Yes. Setup takes five minutes, costs no Framer credits, and the agent is good. Just don't confuse "looks right" with "built right."
The agent only knows what's on the canvas. It doesn't know which components are canonical, which ones break other pages, or which bugs the template already has. Someone has to write that down.
That's what an Agent Kit is: the design rules, references and audit for one Omakase template, written for an agent to read. It's available now for Mindly, Solwell and Ampcore, at $20 per kit, and works with Claude Code, Codex and Framer's own agent. If you'd rather write your own rules, start with what goes in a DESIGN.md file.
FAQ
Is Framer MCP free?
The connection is free and doesn't use Framer AI credits. You pay for the agent itself, so Claude Code needs a paid Claude plan and Codex runs on your ChatGPT plan.
Does Framer have an official MCP server?
No, and it doesn't need one. Framer's External Agents connection does the same job. The "Framer MCP" plugin on the marketplace is community-built.
Should I use Claude Code or Codex?
Both connect the same way. We've built with both. Pick the one you already pay for.
Can the agent publish my site?
It can. In my run it asked before adding sitewide links and before publishing. You should absolutely review the page in Framer first. Alternatively you can publish from Framer directly.
