# Webflow 智能体技能集

`Webflow` `Agent Skills` `AI智能体` `自动化` `开发工具`

# 224 Industries - Webflow 智能体技能集

![224 Industries OSS](https://img.shields.io/badge/224_Industries-OSS-111212?style=for-the-badge&labelColor=6AFFDC)
![MIT License](https://img.shields.io/badge/License-MIT-111212?style=for-the-badge&labelColor=6AFFDC)
[![Webflow 高级合作伙伴](https://img.shields.io/badge/Premium_Partner-146EF5?style=for-the-badge&logo=webflow&logoColor=white)](https://webflow.com/@224-industries)

本仓库收录了由 224 Industries 开发的 Webflow 智能体技能集合。这些技能旨在通过提供专项功能来增强智能体的能力。

<img width="1200" height="630" alt="224-industries-webflow-agent-skills-vercel-skills-cli" alt="安装 224 Industries Webflow 智能体技能集的 Vercel Skills CLI 输出" src="https://github.com/user-attachments/assets/896d2eed-1f2c-4a46-9bae-0f0899f7cb52" />

## 什么是智能体技能？

智能体技能是由指令、脚本和资源组成的文件夹，智能体可以发现并使用它们来更准确、更高效地完成任务。它们适用于所有支持[开放智能体技能标准](https://agentskills.io)的 AI 智能体。

## 可用技能
<!-- START:Available-Skills -->
| 技能 | 描述 | 下载 |
| ---- | ---- | ---- |
| [webflow-browser-api](./skills/webflow-browser-api) | 通过 Browser API 用 JavaScript 控制 Webflow 的分析与优化功能... | [下载](https://skills.224ai.au/webflow-browser-api.skill) |
| [webflow-code-components](./skills/webflow-code-components) | 通过 DevLink 构建、定义并将 React 代码组件导入 Webflow... | [下载](https://skills.224ai.au/webflow-code-components.skill) |
| [webflow-designer-api](./skills/webflow-designer-api) | 使用 Webflow Designer API —— 构建 Designer 扩展或进行其他操作... | [下载](https://skills.224ai.au/webflow-designer-api.skill) |
| [webflow-enterprise-api](./skills/webflow-enterprise-api) | 用于工作区管理、审计日志、站点访问等的 Webflow 企业版 API 端点... | [下载](https://skills.224ai.au/webflow-enterprise-api.skill) |
| [webflow-webhooks](./skills/webflow-webhooks) | 接收并验证 Webflow Webhook。用于设置 Webflow Webhook 处理器... | [下载](https://skills.224ai.au/webflow-webhooks.skill) |
<!-- END:Available-Skills -->

### Webflow 技能套件

想要更多？[Webflow Skills Kit](https://flashbrew.digital/webflow-skills-kit) 是一套面向 Webflow 专业人士的高级智能体技能包，涵盖策略报告生成、发现工作流、客户角色扮演等更多功能。由 Webflow 专业人士为专业人士打造，技能套件旨在帮助您在 Webflow 项目中充分发挥 AI 智能体的潜力，同时节省时间与成本。

## 安装

### 通过 Skills 安装

使用 [skills](https://skills.sh/) 直接安装技能：

```bash

███████╗██╗  ██╗██╗██╗     ██╗     ███████╗
██╔════╝██║ ██╔╝██║██║     ██║     ██╔════╝
███████╗█████╔╝ ██║██║     ██║     ███████╗
╚════██║██╔═██╗ ██║██║     ██║     ╚════██║
███████║██║  ██╗██║███████╗███████╗███████║
╚══════╝╚═╝  ╚═╝╚═╝╚══════╝╚══════╝╚══════╝

# 安装所有技能
npx skills add 224-industries/webflow-skills

# 安装指定技能
npx skills add 224-industries/webflow-skills --skill webflow-designer-api

# 列出可用技能
npx skills add 224-industries/webflow-skills --list
```

<details>
<summary>手动下载</summary>

从上方可用技能表格中直接下载 `.skill` 文件，并上传至任何支持[智能体技能标准](https://agentskills.io)的智能体：

- **Claude Web / 桌面版 / Cowork** —— 前往"自定义 > 技能"，点击 **+**，然后选择**上传技能**

</details>

<details>
<summary>Claude Code / Factory Droid 插件</summary>

```bash
# 添加插件（包含所有技能）
/plugin add 224-industries/webflow-skills
```

</details>

<details>
<summary>Gumloop 智能体</summary>

直接向 [Gumloop](https://docs.gumloop.com/core-concepts/skills) 智能体上传技能：

1. 从上方可用技能表格中下载 `.skill` 文件
2. 在 Gumloop 中，打开智能体配置并滚动至**技能**部分
3. 点击 **+ 技能**并上传 `.skill` 文件

</details>

<details>
<summary>其他 CLI 方式</summary>

智能体技能也可通过 [Playbooks](https://playbooks.com/skills) 或 [Context7](https://context7.com/docs/skills) 安装：

```bash
# Playbooks
npx playbooks add skill 224-industries/webflow-skills

# Context7
npx ctx7 skills install /224-industries/webflow-skills
```

</details>

## 添加新技能

使用内置脚本添加新技能：

```bash
node scripts/add-skill.js <技能名称> "<描述>"
```

示例：

```bash
node scripts/add-skill.js webflow-designer-api "Build Webflow Designer Extensions..."
```

该脚本将创建技能目录结构，并自动更新 manifest.json、平台插件文件、skills/index.json 以及本 README。

## 脚本

| 脚本 | 描述 |
| ---- | ---- |
| `node scripts/add-skill.js` | 向仓库添加新技能 |
| `node scripts/sync-skills.js` | 将 manifest.json、平台插件文件、skills/index.json 和 README 与技能目录同步 |

## 相关资源

- [智能体技能规范](https://agentskills.io/specification)
- [npx skills](https://skills.sh/)
- [验证智能体技能](https://github.com/marketplace/actions/validate-skill)
- [Playbooks](https://playbooks.com/skills)
- [Context7 技能](https://context7.com/docs/skills)

## 贡献

欢迎贡献！请阅读我们的[贡献指南](.github/CONTRIBUTING.md)了解更多信息。

## 许可证

[MIT 许可证](LICENSE)

## 创作者

[Ben Sabic](https://bensabic.dev)（分式 CTO），[224 Industries](https://224industries.com.au)