
Webflow MCP Server
Official Model Context Protocol (MCP) server by Webflow that connects AI agents like Claude, Cursor, and Windsurf directly to your Webflow sites for natural language design, CMS management, and canvas editing.
Overview
Webflow MCP Server is the official Node.js implementation of the Model Context Protocol (MCP) created by Webflow. It exposes Webflow’s Data API and Designer API as structured tools that AI agents can use directly from your preferred coding assistant.
Instead of writing API calls or handling authentication, you simply describe what you want (“create a responsive hero section with these styles” or “bulk update all blog posts with new SEO fields”) and the AI agent executes the changes in real time.
Key Features
- Designer API Tools: Create layouts (sections, grids, containers with breakpoints), apply styles/classes, build reusable components, and manage design systems (colors, typography, spacing)
- CMS & Data Operations: Full CRUD on collections and items, batch updates, content analysis, and SEO suggestions
- Canvas Bridge: Live sync between the AI agent and the actual Webflow Designer via the official MCP Bridge App
- Batch & Performance Optimizations: Multi-item updates, faster response times, and reduced latency (2026 beta improvements)
- Authentication Options: Remote OAuth (hosted server) or local API token
- Tool Consolidation: Fewer but more powerful tools with built-in reasoning and anti-pattern protection
How It Works
- Install the MCP server (remote or local)
- Authorize your Webflow sites/workspaces via OAuth or token
- Launch the Webflow MCP Bridge App inside the Designer (press E)
- Start prompting your AI agent — it now sees and can modify your entire Webflow project in real time
Supported AI Agents
- Claude Desktop (official connector)
- Cursor (official plugin)
- Claude Code
- Windsurf
- Any MCP-compatible client (manual config supported)
Installation Options
Remote (recommended – 5 minutes)
# For Cursor or Claude Desktop
npx -y webflow-mcp-server@latest
Uses Webflow’s hosted MCP endpoint with OAuth.
Local
WEBFLOW_TOKEN=your_token npx -y webflow-mcp-server@latest
Requires Node.js 22.3.0+ and a published MCP Bridge App.
Use Cases
- Prompt-to-layout page creation and full site building
- Automated CMS migrations and content population
- SEO audits, internal linking, and bulk updates
- Design system implementation and style refactoring
- Real-time canvas editing from AI chat
Official Links
- GitHub Repository: https://github.com/webflow/mcp-server
- Full Documentation: https://developers.webflow.com/mcp/reference/overview
- Getting Started Guide: https://developers.webflow.com/mcp/reference/getting-started