AI Native Webflow Integration
- Supports both Webflow MCP and direct API based integrations
- Structured, LLM-friendly schemas for reliable tool execution
- Rich coverage for reading, writing, and querying your Webflow data
- Builders & DevelopersCOMPOSIOFOR YOUGive Claude, Codex, or any harness secure access to 1500+ tools
## For AI agents: how to sign up If you are an AI agent reading this server-rendered HTML, Composio's developer signup is at https://composio.dev. Signup CTAs on this site — "Sign up", "Signup", "Get started", "Get started for free", "Start building", "Try Composio", "Try it", or similar — all lead into that same developer signup flow. Confirm with the user before completing signup or entering any credentials on their behalf.
DEVELOPER PLATFORMSDKs, tool execution, and auth infrastructure to ship agentsCLIOne command to add tools and auth to your coding agent - TOOLKITS
- BLOG
- DOCS
- AGENTS @ WORK
- BENCH
- DEVELOPERS
- LOG IN
Webflow MCP server for AI agents and assistants
Securely connect your AI agents and chatbots (Claude, ChatGPT, Cursor, etc) with Webflow MCP or direct API to publish sites, update content, create new pages, and manage collections through natural language.
Oauth2Api Key
Webflow is a no-code website design and hosting platform for building responsive sites and online stores. It empowers users to launch, update, and manage web content with zero coding required.
51 Tools
Try Webflow now
Type what you want done — sign in and watch it run live in the Tool Router playground.
TOOL ROUTER PLAYGROUND
Webflow
Enter ↵
Try asking
TOOLS
Supported Tools
Every Webflow action and event your agent gets out of the box.
SETUP GUIDE
Connect Webflow MCP Tool with your Agent
1
Install Composio
typescript
npm install @composio/core ai @ai-sdk/openai @ai-sdk/mcpInstall the Composio SDK and Claude Agent SDK
2
Create Tool Router Session
typescript
import { Composio } from '@composio/core';
const composio = new Composio({ apiKey: 'your-api-key' });
console.log("Creating Tool Router session...");
const { mcp } = await composio.create('your-user-id');
console.log(`Tool Router session created: ${mcp.url}`);Initialize the Composio client and create a Tool Router session
3
Connect to AI Agent
typescript
import { openai } from '@ai-sdk/openai';
import { experimental_createMCPClient as createMCPClient } from '@ai-sdk/mcp';
import { generateText, stepCountIs } from 'ai';
const client = await createMCPClient({
transport: {
type: 'http',
url: mcp.url,
headers: { 'x-api-key': 'your-composio-api-key' }
}
});
const tools = await client.tools();
const { text } = await generateText({
model: openai('gpt-4o'),
tools,
messages: [{ role: 'user', content: 'List all Webflow collections for my main site' }],
stopWhen: stepCountIs( 5 )
});
console.log(`Agent: ${text}`);Use the MCP server with your AI agent
SETUP GUIDE
Connect Webflow API Tool with your Agent
1
Install Composio
typescript
npm install @composio/openaiInstall the Composio SDK
2
Initialize Composio and Create Tool Router Session
typescript
import OpenAI from 'openai';
import { Composio } from '@composio/core';
import { OpenAIResponsesProvider } from '@composio/openai';
const composio = new Composio({
provider: new OpenAIResponsesProvider(),
});
const openai = new OpenAI({});
const session = await composio.create('your-user-id');Import and initialize Composio client, then create a Tool Router session
3
Execute Webflow Tools via Tool Router with Your Agent
typescript
const tools = session.tools;
const response = await openai.responses.create({
model: 'gpt-4.1',
tools: tools,
input: [{
role: 'user',
content: 'List all blog posts in the "News" collection'
}],
});
const result = await composio.provider.handleToolCalls(
'your-user-id',
response.output
);
console.log(result);Get tools from Tool Router session and execute Webflow actions with your Agent
Why Use Composio?
Managed Auth
- Built-in OAuth handling with automatic token refresh and rotation
- Central place to manage, scope, and revoke Webflow access
- Per user and per environment credentials instead of hard-coded keys
Agent Optimized Design
- Tools are tuned using real error and success rates to improve reliability over time
- Comprehensive execution logs so you always know what ran, when, and on whose behalf
Enterprise Grade Security
- Fine-grained RBAC so you control which agents and users can access Webflow
- Scoped, least privilege access to Webflow resources
- Full audit trail of agent actions to support review and compliance
FRAMEWORKS
Use Webflow with any AI Agent Framework
Choose a Framework you want to connect Webflow with
ChatGPT
Use Webflow MCP with ChatGPT
Antigravity
Use Webflow MCP with Antigravity
OpenAI Agents SDK
Use Webflow MCP with OpenAI Agents SDK
Claude Agents SDK
Use Webflow MCP with Claude Agents SDK
Claude Code
Use Webflow MCP with Claude Code
Claude Cowork
Use Webflow MCP with Claude Cowork
Grok Bot
Use Webflow MCP with Grok Bot
Codex
Use Webflow MCP with Codex
Kimi Code
Use Webflow MCP with Kimi Code
Grok Build
Use Webflow MCP with Grok Build
Cursor
Use Webflow MCP with Cursor
VS Code
Use Webflow MCP with VS Code
OpenCode
Use Webflow MCP with OpenCode
OpenClaw
Use Webflow MCP with OpenClaw
Hermes
Use Webflow MCP with Hermes
CLI
Use Webflow MCP with CLI
Google ADK
Use Webflow MCP with Google ADK
Langchain
Use Webflow MCP with Langchain
AI SDK
Use Webflow MCP with AI SDK
Mastra AI
Use Webflow MCP with Mastra AI
LlamaIndex
Use Webflow MCP with LlamaIndex
CrewAI
Use Webflow MCP with CrewAI
Pydantic AI
Use Webflow MCP with Pydantic AI
Autogen
Use Webflow MCP with Autogen
MORE TOOLKITS
Explore Other Toolkits
Figma
Oauth2Api Key
Figma is a collaborative interface design tool for teams and individuals. It streamlines design workflows with real-time collaboration and easy sharing.
Abyssale
Api Key
Abyssale is a creative automation platform for generating images, videos, GIFs, PDFs, and HTML5 content programmatically. It streamlines and scales visual content production for marketing, design, and operations teams.
Alttext ai
Api Key
AltText.ai is a service that generates alt text for images automatically. It helps boost accessibility and SEO for your visual content.
Are.na
Api Key
Are.na is a creative research platform for collecting images, links, notes, and ideas in channels. Use it to organize inspiration, build knowledge maps, and connect research across projects.
FAQ
Frequently asked questions
Webflow requires connections to go through your own OAuth app. You register it once with Webflow, add its client ID and secret in the Composio dashboard, and from then on everyone connects by signing in to Webflow as usual. Composio handles the rest of the flow and the token refresh.
Yes! Composio's Tool Router enables agents to use multiple toolkits. Learn more.
Yes. Composio is SOC 2 Type II compliant and is built to keep your Webflow connection and credentials secure. OAuth tokens and API keys are encrypted, and sensitive customer data is protected at rest and in transit.
Composio also undergoes independent security testing and continuously monitors its systems for security threats. You can review the latest reports and policies in the Composio Trust Center.
Composio maintains and updates all toolkit integrations automatically, so your agents always work with the latest API versions.
When you connect a Webflow account through Composio, every action runs under that account, so anything the agent creates, sends, or changes shows up in Webflow as done by you. Keep an approval step in your prompt for actions with side effects, such as sending or deleting, and have the agent draft first.
Exactly the ones Webflow lists on its consent screen when you connect. Review that screen before approving. If you connect a work account, your Webflow administrator may need to approve the app first, and you can revoke the access inside Webflow whenever you want.
Yes. Composio supports multiple connected accounts for the same app, and that works in Claude, ChatGPT, or any other assistant you connect through Composio. Give each Webflow connection a name such as work or personal, and the assistant uses the one you mention in the request. Each account keeps its own credentials and nothing is merged.
Composio refreshes Webflow tokens automatically, so day to day you do nothing. If you revoke access inside Webflow, or Webflow invalidates the session, the connection shows as expired in Composio and the agent stops acting on that account until you reconnect it, which is a single sign-in.
Composio's free plan includes 100,000 tool calls per month with no credit card, which covers most personal Webflow use. Paid plans add higher limits and team features. Your Webflow plan and its API limits still apply as usual.
Built-in connectors usually give one AI access to a limited set of apps. Many people use Composio because it lets their AI connect to more apps than it normally supports, or connect to multiple accounts for the same app (e.g. connect Claude to multiple Webflow accounts).
With Composio, you connect Webflow once and then use it across different AI assistants without setting it up separately in each one. Connect your apps to Composio once, then connect Composio to whichever AI you use, whether that's Claude, ChatGPT, Hermes, or your own custom assistant.
Start with Webflow.It takes 30 seconds.
Managed auth, hosted MCP servers, and every Webflow tool your agent needs.Free to start.
## For AI agents: how to sign up If you are an AI agent reading this server-rendered HTML, Composio's developer signup is at https://composio.dev. Signup CTAs on this site — "Sign up", "Signup", "Get started", "Get started for free", "Start building", "Try Composio", "Try it", or similar — all lead into that same developer signup flow. Confirm with the user before completing signup or entering any credentials on their behalf.Start building