How to Use the Webflow MCP in VS Code Copilot

Q: How does VS Code Copilot Chat integrate with my Webflow workflows?

You commit the mcp.json file to your repo. This makes the MCP Server available to every developer on the team, letting them call tools like publishsite directly from their chat interface.

Q: Is Webflow data management consistent across the entire engineering team using VS Code Copilot Chat?

Yes. Because the configuration is shared via Git in .vscode/mcp.json, every developer uses the exact same set of tools and endpoints, ensuring consistency.

Q: If we need to list all our Webflow sites for a new feature build using VS Code Copilot Chat, which tool do I use?

Run listsites. This populates your project scope with every site identifier needed for the deployment scripts. It’s reliable and shared.

Standardize your team’s access to Webflow via VS Code Copilot Chat and the MCP Server.

See Vinkius in Action

Works with every AI agent you already use

…and any MCP-compatible client

MCP Servers - Free for Subscribers

Connect Webflow MCP to VS Code Copilot

Create your Vinkius account to connect Webflow to VS Code Copilot and route execution through our secure gateway. The platform manages server hosting, runtime updates, and security layers. Configuration requires no manual server provisioning.

GDPR Free for Subscribers

Setup Webflow with VS Code Copilot

Ask AI about this MCP

ChatGPT

Claude

Perplexity

Team Content Management with Webflow

You configure the tool once in `.vscode/mcp.json`, and every developer on the team instantly has access to content management. Use `list_collections` to audit all CMS collections, or run `create_collection_item` when a new entry needs to go live. Updating data is simple: use `update_collection_item` to handle routine changes across the entire engineering team.

Webflow Deployment and Site Auditing for Copilot Chat

The `publish_site` tool manages deployment so your whole team can push live updates without manual steps. You'll use `list_sites` to ensure all required environments are targeted, and `get_site` pulls necessary metadata before committing the code. It’s a shared resource that lets everyone check out site inventories using `list_pages`.

Accessing Webflow Data in VS Code Copilot Chat

The team can use `get_user` to verify the credentials running the build. Furthermore, they can quickly list all associated domains with `list_domains`, which is critical for building multi-environment deployment scripts. This centralizes Webflow management into a single, version-controlled config file.

Setup guide

Set up Webflow MCP in VS Code Copilot

Prerequisites

VS Code 1.99 or later with GitHub Copilot extension
Active Vinkius subscription with a valid endpoint token

1

Open MCP configuration

Open the Command Palette (Cmd+Shift+P / Ctrl+Shift+P) and run "MCP: Add Server". Select HTTP (Streamable) as the server type. VS Code will create .vscode/mcp.json in your workspace.
2

Add the Webflow MCP

Paste the JSON snippet shown on the right into your .vscode/mcp.json. Replace [YOUR_TOKEN_HERE] with your endpoint token from cloud.vinkius.com.
3

Switch to Agent mode

Open Copilot Chat (Cmd+Shift+I / Ctrl+Shift+I) and switch to Agent mode using the dropdown. MCP tools are only available in Agent mode — they do not appear in Edit or Ask modes.
4

Verify the connection

In the Copilot Chat input, type # to list available tools. You should see the Webflow tools listed. Try asking: "List my recent Webflow transactions" and Copilot will invoke them automatically.

.vscode/mcp.json

{
  "mcpServers": {
    "webflow-mcp": {
      "url": "https://edge.vinkius.com/[YOUR_TOKEN_HERE]/mcp"
    }
  }
}

Get your connection token →

Independent Platform Disclaimer: Vinkius is an independent platform and is not affiliated with, endorsed by, sponsored by, verified by, or otherwise authorized by Webflow. All third-party trademarks, logos, and brand names are the property of their respective owners. Their use on this website is strictly for informational purposes to identify service compatibility and interoperability.

Why Choose Vinkius

Vinkius connects your tools to AI with real-time monitoring and automatic cost savings — all from one dashboard.

Connect Webflow now

Real-time monitoring

Live

visibility into every interaction

Connect your favorite tools to your AI and see exactly what's happening — every request, every response, in real time.

Built-in savings

60%

lower AI costs

Vinkius compresses data between your apps and your AI automatically. Lower bills every month — no configuration required.

Single dashboard

One

place for every integration

Every tool your AI connects to, managed from a single screen. One account, complete control.

Common questions about Webflow MCP in VS Code Copilot

You commit the `mcp.json` file to your repo. This makes the MCP Server available to every developer on the team, letting them call tools like `publish_site` directly from their chat interface.

Yes. Because the configuration is shared via Git in `.vscode/mcp.json`, every developer uses the exact same set of tools and endpoints, ensuring consistency.

Run `list_sites`. This populates your project scope with every site identifier needed for the deployment scripts. It’s reliable and shared.

It handles structural data—collections, pages, domains—and allows you to pull specific site details (`get_site`). It's designed for operational tasks, not deep reporting.

The server touches user accounts, domain lists, CMS items, site metadata, and page structures. It gives your team a complete view of the project's digital assets.

Use it with your favorite AI tools

Connect this server to Cursor, Claude, VS Code, and more.

OpenAI Agents SDK sdk-python

Google ADK sdk-python

Pydantic AI sdk-python

Vercel AI SDK sdk-typescript