> This page is for Home.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# Webflow's MCP server now supports the Designer

> Update: Webflow's MCP server now supports the Designer API, giving AI agents the ability to work with the Webflow Designer in real-time.

Webflow's MCP server now supports the Designer API, enabling AI agents to interact directly with the Webflow Designer canvas in real-time. This pivotal update expands the server's capabilities beyond content management, opening new possibilities for AI-assisted visual design.

The MCP server now includes tools that connect directly to the Webflow Designer, allowing AI agents to:

* Create and modify design elements on the canvas
* Manage styles, variables, and components
* Work with responsive breakpoints and layouts
* Access real-time design data and structure

### Companion app for Designer connectivity

![MCP Companion App](/_fern-img/02ae17428a9bc1c3d5ed26bc14b44a66d935ef85970e30b85f6c2b0d64c15ddb.webp)

A new companion app automatically installs during authorization and enables seamless communication between your AI agent and the Designer:

* **Automatic setup**: The companion app installs automatically when you authorize the MCP server
* **Real-time sync**: Maintains a persistent connection between your AI agent and active design sessions
* **Designer access**: Must remain open in the Designer for MCP tools to function

#### Companion app connectivity

**Keep the companion app open**: The MCP Companion App must remain open in the Webflow Designer for Designer API tools to function. Close the app, and you'll lose access to canvas-based operations.

## Getting started

To use the new Designer API features:

1. **Update your MCP configuration** following the [installation guide](/data/docs/ai-tools)
2. **Authorize your sites** through the OAuth flow (the companion app installs automatically)
3. **Open the Designer** and launch the "Webflow MCP Companion App" from the Apps panel
4. **Start designing** with AI-powered prompts like "Create a hero section with responsive design"

## Important requirements

### Node.js version 22.3.0+

The MCP server now requires Node.js version **22.3.0** or higher. If you're using an older version:

* Use `nvm` to install and switch to Node.js 22.3.0
* Clear your `npx` cache: `rm -rf ~/.npm/_npx`
* Restart your AI client after updating

See the [Node.js compatibility section](/docs/ai-tools#nodejs-compatibility) for detailed troubleshooting steps.

## Learn more

For complete setup instructions, tool documentation, and troubleshooting guides, see our [MCP server and AI tools documentation](/docs/ai-tools).