Webflow MCP Server einrichten
Webflow sicher über den offiziellen MCP-Server mit einem KI-Client verbinden – remote per OAuth oder lokal per API-Token.
- Skill Road
- Webflow MCP Server einrichten
Veröffentlicht am 21.09.2026
Vor der Einrichtung entscheiden: remote oder lokal
Webflow bietet den MCP Server in zwei offiziellen Varianten an. Für die meisten Fälle empfiehlt sich der gehostete Remote-Server unter https://mcp.webflow.com/sse, der ohne lokale Installation auskommt und die Authentifizierung über OAuth abwickelt. Die lokale Variante über das npm-Paket webflow-mcp-server lohnt sich vor allem, wenn ein eigenes Webflow-App mit spezifischen Berechtigungen benötigt wird oder kein OAuth-Flow im jeweiligen Netzwerk möglich ist. Node.js 22.3.0 oder neuer ist in beiden Fällen Voraussetzung.
Remote-Server verbinden (empfohlener Weg)
In Cursor wird der Server über .cursor/mcp.json eingetragen:
{
"mcpServers": {
"webflow": { "url": "https://mcp.webflow.com/sse" }
}
}
In Claude Desktop läuft die Verbindung über den mcp-remote-Brückenprozess in claude_desktop_config.json:
{
"mcpServers": {
"webflow": {
"command": "npx",
"args": ["mcp-remote", "https://mcp.webflow.com/sse"]
}
}
}
Nach dem Speichern öffnet der Client automatisch eine OAuth-Anmeldeseite. Dort meldest du dich mit dem Webflow-Konto an und autorisierst den Zugriff auf die gewünschten Sites. Anschließend im Webflow Designer das Apps-Panel öffnen (Taste E) und die veröffentlichte „Webflow MCP Bridge App" starten; sie verbindet die aktive Designer-Sitzung mit dem MCP-Server für Funktionen wie visuelle Snapshots oder Canvas-Navigation.
Lokalen Server einrichten (Alternative)
Für den lokalen Betrieb muss zuerst ein eigenes Webflow-App im Workspace registriert und die zugehörige MCP-Bridge-App im Designer veröffentlicht werden (Details in der offiziellen Dokumentation unter „Register an App"). Danach in der MCP-Konfiguration des Clients hinterlegen:
{
"mcpServers": {
"webflow": {
"command": "npx",
"args": ["-y", "webflow-mcp-server@latest"],
"env": { "WEBFLOW_TOKEN": "<DEIN_WEBFLOW_TOKEN>" }
}
}
}
Das benötigte API-Token lässt sich über Webflows API Playground generieren. Behandle es wie jedes andere Zugangs-Secret: nicht in Klartext teilen, nicht in ein öffentliches Repository committen.
Verbindung mit einer Leseaufgabe prüfen
Bevor du den Agenten schreibende Änderungen vornehmen lässt, prüfe die Verbindung mit einer harmlosen Leseanfrage, etwa: „Liste die letzten fünf Blogbeiträge dieser Site auf." Erst wenn das erwartete Projekt korrekt erkannt wird, eignen sich Aufgaben wie das Anlegen einer neuen Section, das Ergänzen von SEO-Metadaten oder das Verlinken älterer Beiträge. Kontrolliere jede Änderung anschließend im Webflow Activity Log, das laut Anbieter auch die KI-Urheberschaft dokumentiert.
Governance und Berechtigungen im Team
Der Agent kann nur das tun, was das verbundene Konto im Designer ohnehin dürfte. Für Teams mit unterschiedlichen Rollen bedeutet das: Wer nur bestimmte Seiten oder CMS-Sammlungen bearbeiten darf, kann diese Grenze nicht über den MCP-Server umgehen. In Enterprise-Workspaces muss ein Administrator den MCP-Zugang zusätzlich freischalten, bevor einzelne Mitglieder ihn nutzen können.
FAQ
Brauche ich einen bezahlten Webflow-Plan? Laut Anbieter ist MCP 2.0 auf allen Site-Plänen ohne Zusatzkosten nutzbar. Nur das optionale Analytics-Add-on (Webflow Analyze) setzt einen bezahlten Plan voraus.
Was macht die MCP Bridge App genau? Sie verbindet eine aktive Webflow-Designer-Sitzung mit dem MCP-Server und wird für Designer-spezifische Funktionen wie visuelle Snapshots oder Canvas-Navigation benötigt. Beim Remote-Weg installiert Webflow sie automatisch während der OAuth-Autorisierung.
Kann ich Remote- und lokalen Server gleichzeitig nutzen? Das ist offiziell nicht dokumentiert und sollte vermieden werden, um doppelte Werkzeuge und getrennte Sitzungen zu verhindern. Entscheide dich pro Client für einen Weg.
Wofür gelten die 140 GitHub-Sterne? Für das gesamte Repository webflow/mcp-server, das sowohl den Remote- als auch den lokalen Weg bereitstellt; Abruf über die GitHub-API am 21. September 2026.
Wie schränke ich das Risiko bei sensiblen Sites ein? Schreibende Aktionen zunächst an unkritischen Seiten testen, ein Konto mit nur den benötigten Rechten verwenden und Änderungen im Activity Log regelmäßig kontrollieren.
Häufige Fragen
Brauche ich einen bezahlten Webflow-Plan?
Laut Anbieter ist MCP 2.0 auf allen Site-Plänen ohne Zusatzkosten nutzbar. Nur das optionale Analytics-Add-on (Webflow Analyze) setzt einen bezahlten Plan voraus.
Was macht die MCP Bridge App genau?
Sie verbindet eine aktive Webflow-Designer-Sitzung mit dem MCP-Server und wird für Designer-spezifische Funktionen wie visuelle Snapshots oder Canvas-Navigation benötigt. Beim Remote-Weg installiert Webflow sie automatisch während der OAuth-Autorisierung.
Kann ich Remote- und lokalen Server gleichzeitig nutzen?
Das ist offiziell nicht dokumentiert und sollte vermieden werden, um doppelte Werkzeuge und getrennte Sitzungen zu verhindern. Entscheide dich pro Client für einen Weg.
Wofür gelten die 140 GitHub-Sterne?
Für das gesamte Repository webflow/mcp-server, das sowohl den Remote- als auch den lokalen Weg bereitstellt; Abruf über die GitHub-API am 21. September 2026.
Wie schränke ich das Risiko bei sensiblen Sites ein?
Schreibende Aktionen zunächst an unkritischen Seiten testen, ein Konto mit nur den benötigten Rechten verwenden und Änderungen im Activity Log regelmäßig kontrollieren.