Webflow MCP: What It Is & How to Set It Up?

The Webflow MCP server is a bridge that lets an AI agent read and change your Webflow site through natural language.

Viken Patel
Published:
September 28, 2026

Free Website Audit by Experts

Actionable insights to improve SEO, speed, and conversions

Request Free Audit
TL;DR: The Webflow MCP server connects an AI agent like Claude, Cursor, ChatGPT, or Codex directly to your Webflow projects, so you can manage CMS content, pages, and site structure with plain-English prompts instead of clicking through the Designer. As of MCP 2.0, you connect in a few clicks with a native connector no CLI or separate bridge app required and the agent can work across design systems, CMS, and multiple pages. It authorizes through OAuth, and an agent can only do what you can already do in Webflow, with every action written to your site’s activity log. This guide covers what it is, how to connect it in under five minutes, the real tasks it’s good at, and where it still falls short.

Webflow spent 2026 rebranding itself as “the agentic web platform,” and the Model Context Protocol (MCP) server is the piece that makes that phrase mean something. Search interest in “webflow mcp” has climbed sharply this year, and most of what’s written about it is either Webflow’s own documentation or a Reddit thread calling it a game-changer. Neither tells you, as a team actually shipping Webflow sites, when to reach for it and when not to.

We’re a Webflow Premium Partner and we run the MCP server in our own workflow. Here’s the honest, practical version.

What is the Webflow MCP Server?

The Webflow MCP server is a bridge that lets an AI agent read and change your Webflow site through natural language. MCP the Model Context Protocol is an open standard for connecting AI models to external tools and data. Webflow’s implementation exposes its APIs as a set of “tools” the agent can call, so instead of you opening the Designer and editing a CMS collection by hand, you can tell Claude “add these ten blog posts to the CMS with SEO titles and meta descriptions," and it does the work against your live project.

In plain terms: it turns your AI assistant into a Webflow operator that works your site the way a junior team member would except it never leaves the chat window.

It’s important to be precise about what MCP is not. It is not the Webflow AI Assistant (the in-canvas feature that generates sections inside the Designer), and it is not the AI Site Builder. Those are Webflow-hosted features. The MCP server is the connective layer that lets external agents the AI tools you already use drive Webflow from outside the platform.

Does Webflow have an official MCP server?

Yes. Webflow maintains an official, first-party MCP server. It’s hosted remotely at https://mcp.webflow.com/mcp, it’s open-source on GitHub (webflow/mcp-server), and it’s documented in Webflow’s developer docs. You don’t need a third-party bridge or an unofficial connector to use it. It’s now on its second major version MCP 2.0 which is available on all Webflow site plans at no extra cost. Adoption has been steep: Webflow reports MCP usage grew more than 4× between January and July 2026, and roughly 90% of MCP users connect through Claude.

What’s new in Webflow MCP 2.0

MCP 2.0 is a meaningful upgrade over the first release, and it changes how you should set it up. The five changes that matter:

  • No more bridge app. Version 1 needed a separate “MCP Bridge App” installed in your project to reach Designer-level actions. 2.0 removes that dependency the agent can work directly, across multiple pages and sites, without the bridge.
  • Full design system and CMS support. The agent can now work with components, styles, variables, and collection data not just raw content.
  • Agent Instructions. You can store brand guidelines, design rules, and policies centrally so every connected tool references them automatically, instead of re-explaining your standards in every prompt.
  • Governance and collaboration. Team permissions, page branching, and AI-attributed change logs so you can see exactly which changes an agent made.
  • Conversational analytics. You can query your site’s performance data directly through the agent.

The practical upshot: connecting is now a few clicks, and the agent does more once it’s connected.

How the Webflow MCP Server Works

Under the hood, the server is a translation layer. It receives a request from your AI client, converts it into a Webflow API call, executes that call using your OAuth-authorized permissions, and returns a structured result the agent can reason about. Two APIs sit behind it:

  • The Data API handles most of the work CMS collections and items, pages, assets, fonts, site settings, and SEO fields. None of this requires you to have the Designer open.
  • The Designer API handles canvas-level actions reading or changing your current selection, page, breakpoint, and mode, and creating elements, components, and styles visually.

In version 1, Designer-level actions required a separate MCP Bridge App and an active Designer session. MCP 2.0 removes that the agent reaches design system, CMS, and multi-page actions directly, so you no longer have to install and babysit a bridge app for most workflows.

How to Set up Webflow MCP (Step by Step)

There are two ways to connect, and with MCP 2.0 most people should use the first one.

The fast way: connect directly with a native connector (recommended)

You no longer have to touch a config file or the command line. Webflow now offers direct connectors that install in a few clicks and authorize through OAuth the whole thing takes under three minutes.

  • Claude (Desktop and Code). In February 2026, Webflow and Anthropic launched a native Claude connector. Add Webflow from Claude’s connector directory, click connect, and authorize the sites you want the agent to access. No code required. You’ll need a paid Claude account and a Webflow account.
  • Cursor. Cursor supports a one-click install for the Webflow connector add it and complete the OAuth authorization.
  • ChatGPT and Codex. Both are supported through the same connector approach: add Webflow as a connector and authorize.

In every case the flow is the same: install the connector → connect to Webflow → authorize which sites it can access. Once connected, the Webflow tools appear in your client and you can start prompting.

The developer way: add the server via CLI (Claude Code)

If you’re working in Claude Code and prefer the command line, you can add the server manually:

1. Make sure Claude Code is installed (claude --version to check).

2. Add the server:

claude mcp add --transport http webflow https://mcp.webflow.com/mcp

3. Start Claude Code with claude, then run /mcp, select the Webflow server, and a browser window opens for OAuth.

4. Choose which Webflow sites to grant access to, and you’re connected.

To keep a specific site scoped to a specific project folder, add the server with project scope:

claude mcp add --transport http webflow https://mcp.webflow.com/mcp -s project

Other clients like Windsurf follow the same pattern point them at https://mcp.webflow.com/mcp and authorize through OAuth.

Only self-hosting? Almost no one needs to. If you do run the server locally instead of using the hosted endpoint, you’ll need Node.js 22.3.0 or higher. For everyone else, the hosted connector is the right choice.

What can you actually do with the Webflow MCP server?

This is where it earns its place. The tasks below are the ones we reach for repeatedly the work that used to eat an afternoon of clicking.

Bulk CMS content operations. Create, update, and organize CMS items at scale. “Import these 40 case studies into the Case Studies collection, generate a slug and meta description for each, and set the category field” is a single prompt instead of 40 manual entries.

SEO cleanup at scale. Ask the agent to audit meta titles and descriptions across a collection, flag items that are missing or over length, and rewrite them to a consistent pattern. Because it reads your live CMS, it works against real data, not a spreadsheet you have to re-import.

Site audits and consistency checks. “List every page missing an Open Graph image” or “find CMS items with empty SEO fields” surfaces problems that are tedious to hunt for by hand.

Content structure exploration. New to a site you inherited? “List all my collections and show me their field structures” gives you the schema in seconds genuinely useful for agencies onboarding a client’s existing project.

Page and element building. Since MCP 2.0, you can generate elements, components, and styles and work with your design system and variables from a prompt, then refine them by hand, without a separate bridge app. This is powerful, but it’s also where human review matters most (more on that next).

The pattern across all of these: the MCP is best at repetitive, structured, data-heavy work. It’s an accelerator for the grunt work, not a replacement for design judgment.

Is the Webflow MCP server safe to use on a live site?

This is the first question any team should ask, and Webflow’s answer is genuinely well designed. Three safeguards matter:

  1. It respects your permissions. An agent can do through the MCP server only what you can do in the Webflow Designer, and nothing more. It inherits your role and access it can’t escalate privileges.
  2. Everything is logged. Agent activity is written to your site’s activity log, so there’s an audit trail of exactly what the agent changed and when. For teams granting an external agent access, that visibility is essential.
  3. You choose the scope. During authorization you select which sites the agent can touch, so you can keep it to a staging project or a single client site.

Our practical advice: connect it to a staging or duplicate project first, review the activity log after your first few sessions, and treat agent output the way you’d treat a capable junior’s work review before you publish. The safety model is sound, but bulk operations are still bulk operations. A well-phrased prompt can update a hundred items correctly; a sloppy one can update a hundred items wrongly, just as fast.

Limitations to know before you rely on it

No tool is all upside. The ones worth flagging in 2026:

  • Static content edits can be constrained across locales. Updating static page content through the API has had locale-specific limits (for example, localized static pages in secondary locales) check the current docs if localization is central to your workflow, since these constraints change release to release.
  • Canvas builds are first-draft quality. MCP 2.0 can create elements, components, and styles without the old bridge app, but generated layouts still need a human to refine spacing, responsiveness, and polish. It’s a head start, not a finished page.
  • It’s only as good as your prompt. The MCP will do exactly what you ask across your live data. Precision in the prompt is the difference between a time-saver and a cleanup job.
  • It doesn’t replace craft. It’s excellent at content and structure; it is not a substitute for conversion strategy, clean semantic markup decisions, or design taste.

Where the Webflow MCP fits in an Agency Workflow

For us, the MCP has quietly become the tool we use for the parts of a build that are important but not creative migrating and structuring CMS content, standardizing SEO fields across hundreds of items, auditing an inherited site before a redesign, and spinning up first-draft structures we then hand-build. It compresses the mechanical work so our developers spend their time on the things that actually decide whether a site performs: the design system, the semantic code, the conversion architecture.

That’s the honest framing of every AI feature in Webflow’s stack right now, and the MCP is no exception: use it where it accelerates, keep human hands on what matters.

FAQs

1. What is the Webflow MCP server?

It’s Webflow’s official Model Context Protocol server a bridge that lets AI agents like Claude, Cursor, and ChatGPT read and modify your Webflow projects through natural language, by exposing Webflow’s Data and Designer APIs as tools the agent can call.

2. How do I connect Webflow MCP to Claude?

The easiest way is the native connector Webflow and Anthropic launched in 2026: add Webflow from Claude’s connector directory, click connect, and authorize your sites no code, under three minutes. If you prefer the command line in Claude Code, run claude mcp add --transport http webflow https://mcp.webflow.com/mcp, then run /mcp and authorize in the browser window that opens.

3. What is Webflow MCP 2.0 and what changed?

MCP 2.0 is the second version of Webflow’s MCP server, free on all site plans. The biggest change is that it no longer needs a separate bridge app to reach Designer-level actions. It also adds full design-system and CMS support, centralized Agent Instructions for brand and design rules, governance features like team permissions, page branching, and AI-attributed change logs, and the ability to query site analytics conversationally.

4. What’s the Webflow MCP server URL?

‍https://mcp.webflow.com/mcp for the standard remote server.

5. Is the Webflow MCP server free?

The MCP server itself is provided by Webflow at no additional cost; you need a Webflow account with appropriate permissions, and API usage falls under your existing plan’s terms. Your AI client (Claude, Cursor, etc.) has its own pricing.

6. Is Webflow MCP safe?

Yes, with sensible precautions. It only lets an agent do what your Webflow role already permits, logs every action to your site’s activity log, and lets you choose which sites it can access. Start on a staging project and review changes before publishing.

7. What can you do with Webflow MCP?

Bulk CMS content creation and edits, SEO audits and rewrites across collections, site consistency checks, exploring an unfamiliar site’s structure, and since MCP 2.0, without a separate bridge app building elements, components, and styles on the canvas from prompts.

8. Does the Webflow MCP need the Designer open or a bridge app?

No. Version 1 required a separate MCP Bridge App for Designer-level actions, but MCP 2.0 removed that dependency content, CMS, design-system, and multi-page operations work directly once you’ve connected and authorized.

Last updated on:
September 28, 2026

Viken Patel

Viken Patel has 17+ years of experience working with websites. He is passionate about building website that converts. His marketing background helps him build the sales driven websites.

Related Article

Webflow
Design

How to Write a Website Redesign RFP 2026

Website redesign RFP is a written brief that invites agencies to propose how they’d redesign your site, on what timeline, and at what cost.

Sanket vaghani
September 18, 2026
Webflow
Marketing

12 Best SaaS Website Design Agencies in 2026

The best SaaS website design agencies in 2026 include theCSS Agency for Webflow-based SaaS sites, Veza Digital and Amply for B2B SaaS on Webflow.

Viken Patel
September 17, 2026
Webflow
Design

Figma Make vs Webflow: Which Should You Use in 2026? (Honest Comparison)

Figma Make is an AI tool inside Figma that turns natural-language prompts into interactive prototypes and small web apps. Webflow is a production website platform for designing, building, and hosting real marketing sites with a CMS.

Sanket vaghani
September 15, 2026
Let's Work Together

Partner with a Webflow Agency for your Webflow website.

Quick Turnaround. No Contracts. Cancel Anytime. Book a 30 minutes consulting call with our expert.