Home
Blog

How I Build Webflow Sites with Claude and the Webflow MCP

Last updated:
August 15, 2026

I am a certified Webflow developer, and for most of my client work Claude now sits between me and the Designer. Not as a gimmick and not as autocomplete: Claude is connected to my Webflow projects through the official Webflow MCP server, and it builds real pages, real CMS structures, and real SEO metadata under my direction.

This post is the workflow itself: what the setup looks like, what I let Claude do, what I refuse to let it do, and what that means if you hire me to build your site. If you want the basics of what the MCP server is and how to connect it, start with my Webflow MCP server guide and come back.

Short answer: Claude plus the Webflow MCP lets one developer ship Webflow work at a pace that used to need two or three people, without giving up certified-level quality control. The AI handles structure, repetition, CMS wiring, and metadata. I handle design judgment, interactions, and review. Clients get faster ships at the same standard, not cheaper work at a lower one.

What is the Claude plus Webflow MCP setup?

Three pieces:

  • Claude, Anthropic’s AI assistant, running in Claude Code or the desktop app.
  • The Webflow MCP server, Webflow’s official bridge that exposes a site to AI tools through the Model Context Protocol.
  • My Webflow workspace, where the actual sites live, with the MCP connection scoped to the project I am working on.

Once connected, Claude can see and change the site the way a developer with Designer access can, within the permissions the MCP grants. The important part: every action goes through the same APIs Webflow itself uses, so there is no scraping, no browser puppeteering, and nothing undocumented.

What can Claude actually do in a Webflow project?

More than most Webflow developers expect. Working through the MCP, Claude can:

  • Create and edit pages, including titles, meta descriptions, and Open Graph settings
  • Build elements on the canvas with the site’s existing classes while the Designer is open
  • Create and manage CMS collections and items: field schemas, bulk imports, content updates
  • Read and apply classes, variables, and components so builds stay on the design system
  • Manage redirects, forms, and assets
  • Publish, though in my workflow it never does (more on that below)

With the Designer open alongside it, Claude builds visually on the live canvas. Without the Designer, it still handles everything data-side: CMS, page settings, SEO metadata, redirects.

My build workflow, step by step

1. Brief and structure first. I write the page brief the way I would for a junior developer: sections, content, target queries, which existing components to reuse. Claude turns that into a proposed page structure and CMS schema before anything touches the canvas. Correcting a plan costs minutes. Correcting a built page costs hours.

2. Style system before sections. The site’s classes, variables, and components go in first, following Client-First naming. Claude reads the existing style system through the MCP and is instructed to reuse it, never to invent new classes when an existing one fits. This is the single biggest quality lever: AI that respects your class system produces maintainable sites, AI that does not produces a mess with a nice screenshot.

3. Sections built from patterns. Hero, feature grid, FAQ, CTA: most marketing pages are assemblies of known patterns. I point Claude at the pattern, it builds the section with the right classes and real content, and I review on the canvas. Repetitive sections that used to eat afternoons now take a review cycle.

4. CMS wiring and content. Collections, fields, and items are where the MCP workflow embarrasses manual work. Importing a blog, restructuring a collection, or populating 40 team members with images and alt text is exactly the kind of structured, rule-following work Claude does quickly and I verify quickly.

5. SEO pass and QA, by hand and by AI. Claude drafts titles, descriptions, and schema for every page, following my rules (no fluff, real numbers, no em dashes). Then I do what the AI cannot: click through every page, test the forms, check the interactions, and review the build like the certified developer the client hired.

Where the AI workflow wins

  • Repetitive structure. Second, third, tenth landing page on the same system: dramatically faster.
  • CMS operations. Bulk imports, schema changes, content migrations, alt text passes.
  • Metadata and schema. Every page gets complete, consistent SEO settings. Nothing is forgotten because checklists are what AI is best at.
  • Consistency. Claude never gets tired and names a class div-block-47 at 11pm. I have.
  • Refactors. “Swap this section pattern across six pages” goes from a dreaded task to a prompt plus review.

Where my hands still beat it

Honesty, because that is the point of this blog:

  • Novel visual design. A distinctive hero, an unusual layout, art direction: the AI proposes, but the taste is mine.
  • Complex interactions. GSAP timelines and scroll behavior still get built and tuned by hand.
  • Client judgment. What to build, what to cut, what the brief should have said: no protocol fixes that.

The workflow is a force multiplier on a developer’s standards. It multiplies sloppy standards just as effectively, which is why “AI-built Webflow site” alone tells you nothing about quality.

The guardrails that make it safe

  • Claude never publishes. Everything ships to staging, I review, I publish.
  • Class discipline is enforced, not hoped for: instructions pin Claude to the existing system, and I diff the style panel after sessions.
  • CMS changes run on test items first when the collection is live.
  • The client’s site is never the sandbox. New patterns get proven on my own workspace before they touch client work.

What this means if you hire me

You get certified Webflow development with the throughput of a small team: faster ships on the same quality bar, pages that stay maintainable, and SEO settings done completely on every page, not just the ones somebody remembered. It is the same reason my AI integration services exist: I sell what I use daily, not what a trend piece told me to offer.

If you are choosing a platform first, my Webflow vs Astro comparison covers when Webflow is the right call at all.

FAQ

Is this the same as Webflow’s AI Assistant?

No. Webflow’s built-in AI works inside the Designer on Webflow’s terms. My workflow connects Claude, a frontier model I direct with project-specific instructions, through the official MCP server. The difference in practice is control: my rules, my class system, my review gates.

Can Claude break a live site?

Not in this workflow. It works on staging, publishing stays manual, and destructive operations are reviewed before they run. The MCP also only grants access to the specific site I connect, not the whole workspace.

Do clients pay extra for the AI workflow?

No. You pay my normal fixed quote. The workflow is why that quote ships faster than agencies quoting the same scope, not a line item on top.

Can I set this up myself?

If you run your own Webflow site and are comfortable with AI tools, yes: the setup guide walks through connecting the MCP server. The workflow discipline in this post is the part that takes longer to build than the connection.

Table of Contents

Want your Webflow site built AI-first?

Certified Webflow development, shipped faster with Claude and the Webflow MCP. Fixed quote after a free audit, and you talk to the person who builds it.