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 to your favorite AI agents and platforms in just 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.

Frequently Asked Questions

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. 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 matching task, it reads the instructions and works with the right context. No guessing, no hallucinating, no generic output.

Which AI tools support Agent Skills?

Agent Skills work across Claude Web, Claude Desktop, Claude Cowork, Claude Code, Gumloop, the Vercel AI SDK, Playbooks, and Context7. Any AI agent that supports the open Agent Skills standard can use them. Anthropic originally built the format for Claude, then released it as an open standard.

What Webflow skills are available?

There are five open-source skills: webflow-browser-api for tracking and consent management, webflow-code-components for React components via DevLink, webflow-designer-api for Designer Extensions and the Playground, webflow-enterprise-api for enterprise-only endpoints, and webflow-webhooks for receiving and verifying webhook events.

How do I install Webflow Agent Skills?

The fastest way is to download a .skill file and upload it in Claude via Customize > Skills. You can also install via the Skills CLI (npx skills add 224-industries/webflow-skills), Claude Code (/plugin add 224-industries/webflow-skills), Gumloop, Playbooks, or Context7. See the installation section above for full instructions.

Can I create my own Agent Skills?

Yes. A skill is just a folder with a SKILL.md file and any supporting references, scripts, or assets. Create a SKILL.md with YAML frontmatter (name and description), add your instructions in the body, and you have a working skill. See the Agent Skills specification for the full format.

Are these skills free to use?

Yes. All five Webflow skills in this repository are open-source under the MIT license. You can use, modify, and distribute them freely. For premium skills covering strategy, discovery, and client workflows, check out the Webflow Skills Kit.