Before you connect anything, it helps to understand what MCP is actually connecting.

MCP stands for Model Context Protocol. In Webflow, MCP gives an AI agent a way to work with your site using Webflow's own tools and APIs.

Put another way: you can use natural language prompts to do more than talk about site work. You can ask an agent to help carry it out.

MCP and agents

The Webflow MCP server gives an agent access to tools for working with pages, CMS collections, styles, components, assets, page settings, and site data.

An agent is different from a standard AI chat because it can act through connected tools. Instead of asking how to create a CMS collection and getting a list of steps, you can ask the agent to help create the collection.

This course uses Claude Chat for the demos, but Webflow MCP can also work with other AI tools, including Claude Code, ChatGPT, Cursor, and Windsurf. The setup and interface may differ slightly depending on the agent, but the core concepts are the same: the agent connects to Webflow through MCP, uses the tools available to it, and works within your Webflow permissions.

You can review supported agents and setup paths in the Webflow MCP developer documentation.

What you can do with MCP

MCP can help with a wide range of tasks in Webflow. It helps to think about them in two buckets: work that happens with your site data, and work that happens on the canvas.

Work with site data

Some tasks work directly with your site data. This includes things like reading pages, updating metadata, creating CMS collections, managing CMS items, working with assets, or checking SEO fields.

Work on the canvas

Other tasks work directly on the Webflow canvas. This includes things like creating and editing elements, components, styles, variables, and sections.

The MCP Bridge App

The Bridge App connects your open Webflow site to the agent for tasks that need live visual context: snapshots, or prompts that reference a specific element on screen, like “change this heading.” Most canvas tasks work without it. It installs automatically when you authorize MCP, and the agent will let you know when it's needed.

Context shapes the result

MCP works best when the agent has clear structure to work with.

For data tasks, that structure might come from clear collection names, field names, page titles, and metadata patterns. For canvas work, it might come from named classes, reusable components, variables, and a consistent design system.

That structure becomes part of the context the agent uses. A well-organized site gives the agent more to reference. A blank canvas or inconsistent class system gives it less to work from, which can lead to less predictable output.

This is not unique to MCP. It is part of working with AI in a context-dependent system, and it is why the quality of your site structure matters before you send the prompt.

Ready to continue?

Click Complete & continue to connect Claude to your Webflow workspace and see MCP in action.