Search
Connect Framer to Claude, Codex, Cursor, and more
Skip the MCP setup. Framer works directly with Claude Code, Cursor, Codex, and other AI tools. Native access to Framer with your own AI agents for deeper capabilities, custom skills and the latest model advancements.
Copy install prompt
Claude Code
Connect Claude to Framer with full access to your canvas, components, CMS, and more. Get Claude Code.
Copy install prompt
Cursor
Connect Cursor to Framer with full access to your canvas, components, CMS, and more. Get Cursor.
Connect Cursor to Framer with full access to your canvas, components, CMS, and more. Get Cursor.
Copy install prompt
Gemini CLI
Connect Gemini CLI to Framer with full access to your canvas, components, CMS, and more. Get Gemini CLI.
Copy install prompt
Connect your external agent
Opus 4.7 · Claude Max
/Users/paul
> npx @framer/agent setup
Run the install prompt
Run the install prompt in your preferred AI. This installs the bridge your agent uses to talk to Framer.
> npx @framer/agent setup
⏺ Bash (npx @framer/agent setup)\ Installed 2 skills to /Users/paul/.agents/skills, /Users/paul/.claude/skills
> /framer
Connect to your projects
In your AI agent, run the /framer skill to connect it to your Framer project and grant access to the project from your browser.
⏺ Bash (npx @framer/agent setup)\ Installed 2 skills to /Users/paul/.agents/skills, /Users/paul/.claude/skills
Connected to your Site project (session 6). What would you like me to help you with?
> List all the blogposts in my project
Write your first prompt
Tell your agent what to build, change, or fix. It works directly in your Framer project without the need to have it open.
Frequently asked questions
Do I need to set up a Framer MCP server?
No. Framer doesn’t require a separate MCP server. If you’re searching for a Framer MCP, the native Framer External Agent connection gives Claude Code, Cursor, Codex, Gemini CLI, and other AI tools direct access to your canvas, components, CMS, and project context, without manual MCP setup.
Which AI agents are supported?
Framer Agent works with any AI that can run a terminal command or call an MCP tool, including Claude Code, Codex, Cursor, Gemini CLI, and Windsurf. If your agent supports tools or a terminal, it can connect.
Can the agent edit my live site?
No. The agent works on your canvas in the Framer editor, not on your published site. Changes only go live when you choose to publish them yourself or tell the agent.
Does the agent have access to my CMS?
Yes. Once connected, the agent can read and write CMS collections, including creating, updating, and deleting items. You stay in control of what gets published.
Is it safe to give an agent access to my project?
The agent only has access to the projects you explicitly connect it to. It cannot access other projects, your account settings, or billing. You can revoke access at any time.
What happens if the agent makes a mistake?
Framer has branching, so every change made by an external agent automatically happens on a branch. You can undo changes, review the branch, and decide when to merge it back into your main branch.
Connect Framer to Claude, Codex, Cursor, and more
Skip the MCP setup. Framer works directly with Claude Code, Cursor, Codex, and other AI tools. Native access to Framer with your own AI agents for deeper capabilities, custom skills and the latest model advancements.
Codex
Connect Codex to Framer with full access to your canvas, components, CMS, and more. Get Codex.
Copy install prompt
Claude Code
Connect Claude to Framer with full access to your canvas, components, CMS, and more. Get Claude Code.
Copy install prompt
Cursor
Connect Cursor to Framer with full access to your canvas, components, CMS, and more. Get Cursor.
Copy install prompt
Gemini CLI
Connect Gemini CLI to Framer with full access to your canvas, components, CMS, and more. Get Gemini CLI.
Copy install prompt
Connect your external agent
Opus 4.7 · Claude Max
/Users/paul
> npx @framer/agent setup
Run the install prompt
Run the install prompt in your preferred AI. This installs the bridge your agent uses to talk to Framer.
> npx @framer/agent setup
⏺ Bash (npx @framer/agent setup)\ Installed 2 skills to /Users/paul/.agents/skills, /Users/paul/.claude/skills
> /framer
Connect to your projects
In your AI agent, run the /framer skill to connect it to your Framer project and grant access to the project from your browser.
⏺ Bash (npx @framer/agent setup)\ Installed 2 skills to /Users/paul/.agents/skills, /Users/paul/.claude/skills
Connected to your Site project (session 6). What would you like me to help you with?
> List all the blogposts in my project
Write your first prompt
Tell your agent what to build, change, or fix. It works directly in your Framer project without the need to have it open.
Frequently asked questions
Do I need to set up a Framer MCP server?
No. Framer doesn’t require a separate MCP server. If you’re searching for a Framer MCP, the native Framer External Agent connection gives Claude Code, Cursor, Codex, Gemini CLI, and other AI tools direct access to your canvas, components, CMS, and project context, without manual MCP setup.
Which AI agents are supported?
Framer Agent works with any AI that can run a terminal command or call an MCP tool, including Claude Code, Codex, Cursor, Gemini CLI, and Windsurf. If your agent supports tools or a terminal, it can connect.
Can the agent edit my live site?
No. The agent works on your canvas in the Framer editor, not on your published site. Changes only go live when you choose to publish them yourself or tell the agent.
Does the agent have access to my CMS?
Yes. Once connected, the agent can read and write CMS collections, including creating, updating, and deleting items. You stay in control of what gets published.
Is it safe to give an agent access to my project?
The agent only has access to the projects you explicitly connect it to. It cannot access other projects, your account settings, or billing. You can revoke access at any time.
What happens if the agent makes a mistake?
Framer has branching, so every change made by an external agent automatically happens on a branch. You can undo changes, review the branch, and decide when to merge it back into your main branch.
Get started with Framer
Get started with Framer
Get started with Framer
