Webflow Agent Skills

Give your AI agents the context they need to build, ship, and automate across Webflow.

What are Agent Skills?

An agent skill is a folder containing instructions, reference docs, and scripts that an AI agent can read when it needs them. Think of it like an onboarding guide you'd hand a new team member on their first day, except the new hire is an AI model.

Each skill has a SKILL.md file that tells the agent what the skill does and when to use it. When the agent encounters a task that matches, it reads the instructions and gets to work with the right context. No guessing, no hallucinating, no generic output.

Anthropic originally built skills for Claude, then released the format as an open standard. Now they work across a growing number of AI tools, and partners like Canva, Notion, Figma, and Atlassian are already building their own.

Available Skills

Five open-source skills for the Webflow platform, from browser-side tracking to enterprise API management.

webflow-browser-api Control Webflow Analyze & Optimize via the Browser API. Manage tracking consent, integrate CMPs, track experiments, and personalize experiences. Source Download
webflow-code-components Build and import React code components into Webflow via DevLink. Configure declareComponent definitions, prop types, and Shadow DOM styling. Source Download
webflow-designer-api Build Designer Extensions or generate Playground code. Work with elements, styles, components, pages, variables, and assets. Source Download
webflow-enterprise-api Enterprise-only endpoints for workspace management, audit logs, site activity, 301 redirects, robots.txt, and well-known files. Source Download
webflow-webhooks Receive and verify Webflow webhooks. Handle form submissions, site publishes, ecommerce orders, and collection item changes. Source Download

Webflow Skills Kit

Premium skills for Webflow professionals: strategy reports, discovery workflows, client roleplay, and more. Built for and by Webflow professionals, the Skills Kit is designed to help you get the most out of AI agents in your Webflow projects, while saving you money and time.

Learn more

Installation

Add the skills with your AI agent in a few clicks.

# Install all skills npx skills add 224-industries/webflow-skills # Install a specific skill npx skills add 224-industries/webflow-skills --skill webflow-designer-api # List available skills npx skills add 224-industries/webflow-skills --list Powered by skills.sh
# Add the plugin (includes all skills) /plugin add 224-industries/webflow-skills Also supported in Factory's Droid.
# 1. Download the .skill file from the skills above # 2. Go to Customize > Skills in Claude # 3. Click "+" then "Upload a skill" # 4. Upload the .skill file and toggle it on Skills are also supported in Claude Desktop and Claude Cowork.
# 1. Download the .skill file from the skills above # 2. In Gumloop, open your agent's configuration # 3. Scroll to the Skills section # 4. Click + Skill and upload the .skill file Learn more in the Gumloop docs.
# Clone the skills into your project git clone https://github.com/224-industries/webflow-skills.git ./skills # Skills are discovered at startup via SKILL.md frontmatter # and loaded on demand through a load_skill tool See the full guide at ai-sdk.dev/cookbook/guides/agent-skills.
npx playbooks add skill 224-industries/webflow-skills Learn more at playbooks.com/skills.
npx ctx7 skills install /224-industries/webflow-skills Learn more at context7.com/docs/skills.