Webflow MCP 2.0 + Claude: connect Claude to Webflow in 2026

Artificial intelligence becomes genuinely useful when it moves beyond generating text and can understand a website and act on it. That is exactly what the Webflow MCP Server is designed to do: connect agents such as Claude directly to Webflow projects.

Updated August 2026: Webflow has released MCP 2.0. This version significantly expands the Claude integration: most operations involving elements, components, styles, and variables no longer require an active Designer session. The server also adds access to features such as Webflow Analyze, forms, sitemap controls, custom fonts, and Agent Instructions.

In other words, Claude is no longer useful only for auditing a CMS or preparing content. It can now work much more deeply across the building, maintenance, and analysis of a Webflow site, while respecting the permissions defined in the workspace.

What is the Model Context Protocol?

The Model Context Protocol, or MCP, is an open standard that allows an AI application to use external tools and data. In Webflow’s case, the MCP server exposes platform capabilities as tools an agent can call from a conversation.

The principle is simple: you describe what you want in natural language, Claude selects the appropriate Webflow tools, reads the required data, and performs the authorized actions. With the official connectors, authentication is handled through OAuth, so you do not need to manually create and paste an API key for the standard setup.

What MCP 2.0 really changes with Claude

The biggest difference is that the Webflow Designer no longer needs to stay open for most operations. In previous versions, visual structure changes depended heavily on the Bridge App and an active Designer session. With MCP 2.0, Claude can work directly with the site structure through Webflow’s APIs.

1. Build and modify elements

Claude can now query a page’s element tree and update text, links, images, attributes, tags, visibility, and element settings. It can also move or remove elements and build new structures from a schema, HTML, and CSS.

A prompt such as “create a responsive hero section using the site’s existing styles” can therefore trigger an actual Webflow build operation, rather than simply producing code that you need to recreate manually.

2. Work with components

MCP 2.0 gives agents much more complete control over Webflow components: creation, instances, props, variants, slots, and metadata. Claude can also connect certain elements and components to CMS data.

This is especially useful on sites with a consistent design system. Instead of creating an isolated section with improvised styles, the agent can reuse the components and conventions already present in the project.

3. Modify the design system, styles, and variables

Claude can read and edit classes, combo classes, CSS properties, variables, variable collections, and modes. You can ask it to standardize spacing, create a new color palette, or replace hard-coded values with existing variables.

This makes refactoring much more powerful: the agent can work on the system that actually drives the site instead of treating each element in isolation.

CMS, assets, pages, and custom code: a much broader scope

The CMS capabilities are still available, of course: read collections, create or update items, perform bulk updates, publish or unpublish content, and inspect field structures.

But MCP 2.0 also expands the surrounding workflow:

• Pages: create pages, update settings, and manage schema markup.
• Assets: read, rename, organize into folders, and compress images to WebP or AVIF.
• Custom code: read and write site-level or page-level head/footer code, in addition to managing registered scripts.
• Fonts: manage custom font files uploaded to Webflow.
• Sitemap: read and change whether static pages and CMS items are included in the sitemap.
• Forms: read forms and submissions, with supported actions on submission data.

Analyze traffic directly from Claude

One of the most interesting MCP 2.0 additions is access to Webflow Analyze for sites that have the feature. Claude can query sessions, users, pageviews, top pages, traffic sources, engagement events, and time on page.

You can ask a question such as “which pages have the most mobile traffic this week, and which of those have the lowest average time on page?” and then continue with a content review or optimization plan.

This is where the workflow becomes more powerful: the same agent can observe performance, understand the site structure, and then act on the content or design.

Agent Instructions: teach Claude how your site should be managed

MCP 2.0 also introduces Agent Instructions. Webflow distinguishes between rules, which act as persistent guardrails, and skills, which describe more specialized workflows.

You can define instructions such as:

• always reuse existing variables before creating a new color;
• follow a specific class naming convention;
• never publish without explicit approval;
• use a defined structure for components;
• follow the site’s editorial tone for CMS content.

These instructions can reference real Webflow resources such as variables, components, styles, pages, CMS collections, and locales. That means the agent works with the actual context of the site instead of generic documentation.

How to connect Claude to Webflow in 2026

The recommended setup uses the official Webflow connector in Claude Desktop:

1. In Claude, click +, then Add connectors.
2. Search for Webflow and click Connect.
3. Sign in to Webflow if prompted.
4. Authorize the sites and workspace Claude should be able to access.
5. Try a first prompt such as “list all my collections and their fields.”

You can also connect the server manually using the official URL https://mcp.webflow.com/mcp.

Do you still need the Bridge App?

For most tasks, no. That is one of the main changes in MCP 2.0.

The Bridge App is still required when an agent needs live visual context or the current Designer state, for example to capture a snapshot, read the currently selected element, navigate the canvas, inspect breakpoints, or interpret a prompt such as “change this heading” that depends on what is visible on screen.

For CMS operations, pages, components, styles, variables, assets, custom code, and Analyze data, the Designer can generally stay closed.

Useful prompt examples with MCP 2.0

• “Analyze my variables and propose a calmer color palette without creating hard-coded values.”
• “Create a testimonial component with image, name, role, and quote, then add props for each field.”
• “Find every blog post without a meta description and prepare the fixes.”
• “Compress the heaviest PNG and JPEG assets to AVIF where appropriate.”
• “List pages excluded from the sitemap and tell me which ones should probably be indexed.”
• “Analyze the most visited pages from the last 30 days and propose three priority optimizations.”
• “Check that new sections follow the variables, components, and conventions defined in the Agent Instructions.”

Limitations to keep in mind

MCP 2.0 is much more capable, but it does not completely replace the Designer.

• Webflow Interactions IX3 still cannot be created or edited through MCP.
• Visual snapshots and some canvas-related actions still require a Designer session with the Bridge App.
• Creating brand-new localized CMS items in a secondary locale is not yet supported, although existing localized content can be read and updated.
• Each MCP authorization is tied to one workspace. To switch workspaces, you need to re-authenticate.
• Some capabilities, such as Webflow Analyze or certain governance features, depend on what is available on the site or plan.

Security and governance

The MCP server respects existing Webflow roles and permissions. An agent does not receive more access than the user who authorized it. MCP actions also integrate with Webflow’s activity and audit mechanisms, which makes it easier to trace changes on production projects.

A sensible workflow is still to limit access to the sites you actually need, use branches or staging for sensitive work, and request a preview or explicit confirmation before important operations.

Conclusion

With MCP 2.0, connecting Claude to Webflow is no longer just about automating the CMS. The agent can work on visual structure, components, styles, variables, assets, custom code, sitemap controls, and even performance data, without requiring an active Designer session for most tasks.

For freelancers and teams maintaining multiple Webflow sites, that is a meaningful shift: Claude becomes a real control layer for the site, capable of analyzing, building, and maintaining the project from natural-language instructions.