MCP Server Builder
anthropics/skills
Guides the design and implementation of Model Context Protocol servers in TypeScript or Python, from tool naming and error messages to evaluation.
当用户要在 OpenLoaf 工作台 / 桌面上新增、修改、查看、删除 widget（桌面组件 / 小组件 / 仪表盘卡片）时触发。典型说法"加个天气 widget"、"做个番茄钟组件"、"改下这个 widget 的颜色"。不用于：聊天消息里一次性展示图表（→visualization-ops-skill）、AI 生成图片（→cloud-media-skill）、对话里随口提到"时钟 /…
AGPL-3.0Auto-check: notes
Install Workbench Ops Skill
$ npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install OpenLoaf/OpenLoaf workbench-ops-skill --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .claude/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/workbench-ops .claude/skills/workbench-ops-skill && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "workbench-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-ops into .claude/skills/workbench-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "workbench-ops-skill", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-opsType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install OpenLoaf/OpenLoaf workbench-ops-skill --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .agents/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/workbench-ops .agents/skills/workbench-ops-skill && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "workbench-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-ops into .agents/skills/workbench-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "workbench-ops-skill", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install OpenLoaf/OpenLoaf workbench-ops-skill --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/workbench-ops .cursor/skills/workbench-ops-skill && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "workbench-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-ops into .cursor/skills/workbench-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "workbench-ops-skill", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/OpenLoaf/OpenLoaf.git --path apps/server/src/ai/builtin-skills/workbench-ops--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install OpenLoaf/OpenLoaf workbench-ops-skill --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/workbench-ops .gemini/skills/workbench-ops-skill && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "workbench-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-ops into .gemini/skills/workbench-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "workbench-ops-skill", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install OpenLoaf/OpenLoaf workbench-ops-skillInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .github/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/workbench-ops .github/skills/workbench-ops-skill && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "workbench-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-ops into .github/skills/workbench-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "workbench-ops-skill", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install OpenLoaf/OpenLoaf workbench-ops-skill --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/workbench-ops .opencode/skills/workbench-ops-skill && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "workbench-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/workbench-ops into .opencode/skills/workbench-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "workbench-ops-skill", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
workbench-ops-skill- GitHub stars
- 107
- Token cost
- ~744 tokens
- SKILL.md length
- 205 words
- Files
- 1
- Skills in repo
- 34
- Repo updated
- First seen
- Licence
- AGPL-3.0
At a glance
当用户要在 OpenLoaf 工作台 / 桌面上新增、修改、查看、删除 widget（桌面组件 / 小组件 / 仪表盘卡片）时触发。典型说法"加个天气 widget"、"做个番茄钟组件"、"改下这个 widget 的颜色"。不用于：聊天消息里一次性展示图表（→visualization-ops-skill）、AI 生成图片（→cloud-media-skill）、对话里随口提到"时钟 /…
- Works in 5 steps: WidgetInit — 生成脚手架目录 → ToolSearch(names:… → Write — 写入 widget.tsx（前端组件） → …
- SKILL.md covers 工具清单, 决策树, 修改 vs 重建决策 and 创建新 Widget（必须按顺序）, plus 4 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Workbench Ops Skill is an agent skill from OpenLoaf/OpenLoaf. 当用户要在 OpenLoaf 工作台 / 桌面上新增、修改、查看、删除 widget（桌面组件 / 小组件 / 仪表盘卡片）时触发。典型说法"加个天气 widget"、"做个番茄钟组件"、"改下这个 widget 的颜色"。不用于：聊天消息里一次性展示图表（→visualization-ops-skill）、AI 生成图片（→cloud-media-skill）、对话里随口提到"时钟 / 倒计时"（→直接回答）。
Its SKILL.md is about 740 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It works with TypeScript. The repository describes itself as: 🍞Open-source, local-first AI workspace with Agents, multi-model chat (GPT/Claude/Gemini/DeepSeek), Notion-like docs, AI image & video generation, email, calendar & terminal…. The licence is AGPL-3.0.
Example prompts
- “加个天气 widget”
- “做个番茄钟组件”
- “改下这个 widget 的颜色”
- “/workbench-ops-skill”
Workflow steps
5 steps, taken from the first numbered list in SKILL.md.
- WidgetInit — 生成脚手架目录
- ToolSearch(names: "generate-dynamic-widget") — 加载编码规范
- Write — 写入 widget.tsx（前端组件）
- Write — 写入 functions.ts（服务端函数，按需）
- WidgetCheck — 编译 + 触发实时预览
What it can do on your machine
Read from SKILL.md and the folder at commit f7eccf6. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Workbench Ops Skill loads about 744 tokens when it runs. Until then it costs about 58 tokens; SKILL.md has 205 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check: notes
The automated check noted patterns worth knowing about, such as sudo or a known installer.
- NoteMentions a .env fileSKILL.md:92
- 敏感信息（API Key 等）通过 Widget 目录下 `.env` 注入，禁止硬编码
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from OpenLoaf/OpenLoaf at commit f7eccf6, republished under its AGPL-3.0 licence (© OpenLoaf). 205 words, ~744 tokens.
Download SKILL.mdSave it as
.claude/skills/workbench-ops-skill/SKILL.md (or your agent's skills folder).- name
- workbench-ops-skill
- description
- 当用户要在 OpenLoaf 工作台 / 桌面上新增、修改、查看、删除 widget（桌面组件 / 小组件 / 仪表盘卡片）时触发。典型说法"加个天气 widget"、"做个番茄钟组件"、"改下这个 widget 的颜色"。**不用于**：聊天消息里一次性展示图表（→visualization-ops-skill）、AI 生成图片（→cloud-media-skill）、对话里随口提到"时钟 / 倒计时"（→直接回答）。
- tools
- WidgetInit, WidgetList, WidgetGet, WidgetCheck, GenerateWidget
工作台 Widget 管理
本 skill 负责 Widget 生命周期管理（创建脚手架、查询、验证编译）。编码细节（SDK API、组件写法、安全沙箱）在 generate-dynamic-widget skill 中，需要写代码时先 LoadSkill(skillName: "generate-dynamic-widget")。
工具清单
| 工具 | 职责 | 只读 |
|---|---|---|
WidgetInit | 生成 widget 脚手架目录（~/.openloaf/dynamic-widgets/<id>/） | 否 |
WidgetList | 列出所有已创建的 widget | 是 |
WidgetGet | 读取单个 widget 详情 | 是 |
WidgetCheck | 编译 widget（TypeScript）+ 触发实时预览刷新 | 是 |
GenerateWidget | Widget 代码生成（详见 generate-dynamic-widget skill） | 否 |
Read | Widget 代码读取（常驻工具） | 是 |
Edit | Widget 代码编辑（常驻工具） | 否 |
加载：
Read/Edit始终可用；WidgetInit/WidgetList/WidgetGet/WidgetCheck/GenerateWidget调用前须先ToolSearch(names: "WidgetInit,WidgetList,WidgetGet,WidgetCheck,GenerateWidget")激活 schema。
决策树
用户想要 Widget
├── 已有 Widget？
│ ├── 是 → WidgetList → WidgetGet → Read → 了解现状
│ │ └── 需要改代码 → ToolSearch(names: "generate-dynamic-widget")
│ │ └── Edit → WidgetCheck
│ └── 否 → 创建新 Widget（见下方流程）
└── 只是查询/浏览？
└── WidgetList / WidgetGet 即可修改 vs 重建决策
当用户想要变更已有 Widget 时：
- 修改现有（Edit）：用户说"加个 X 功能"、"改下颜色"、"多显示一个字段" → 在现有代码上增量修改
- 重新创建（WidgetInit）：根本性变更，例如从"天气组件"变成"股票行情"、整体架构/布局完全不同 → 新建 Widget 替换
创建新 Widget（必须按顺序）
WidgetInit— 生成脚手架目录- 为什么先 init？因为它创建正确的目录结构（
~/.openloaf/dynamic-widgets/<id>/）、package.json 和类型桩文件。跳过此步直接写文件会导致编译器找不到类型定义。
- 为什么先 init？因为它创建正确的目录结构（
ToolSearch(names: "generate-dynamic-widget")— 加载编码规范Write— 写入 widget.tsx（前端组件）Write— 写入 functions.ts（服务端函数，按需）WidgetCheck— 编译 + 触发实时预览- 为什么最后必须 check？因为它执行 TypeScript 编译并通知前端刷新预览。不调用 check，用户看到的仍是旧内容。
修改已有 Widget
WidgetList→WidgetGet→Read— 定位并读取源码Edit— 精确替换修改WidgetCheck— 编译验证
WidgetCheck 编译失败恢复
当 WidgetCheck 返回编译错误时：
- 读取错误信息 — 关注 TypeScript 错误行号和描述
- 常见错误及修复：
Cannot find module 'xxx'→ widget.tsx 只能 importreact、react/jsx-runtime、@openloaf/widget-sdk，删除禁用的导入Type 'xxx' is not assignable→ 检查 SDK 类型定义，确认 props/state 类型匹配JSX element type does not have any construct→ 检查组件导出是否正确（必须export default）
- 用
Edit修复 → 再次WidgetCheck，直到编译通过
Widget 能力边界
适合做的事情：
- 数据展示（图表、统计卡片、列表）
- 简单交互（按钮、切换、输入框）
- 定时轮询 API 获取数据（通过 functions.ts 服务端函数）
- 静态或低频更新内容（天气、日历、待办、时钟、番茄钟）
不适合做的事情：
- 复杂多页面流程（应使用独立页面）
- 重计算任务（服务端函数有 10 秒超时限制）
- 实时 WebSocket 长连接（沙箱不支持）
- 需要访问本地文件系统的操作（安全沙箱隔离）
关键约束
- Widget 代码目录：
~/.openloaf/dynamic-widgets/<widget-id>/ widget.tsx只能 import：react、react/jsx-runtime、@openloaf/widget-sdkfunctions.ts在 Server 端执行，10 秒超时- 敏感信息（API Key 等）通过 Widget 目录下
.env注入，禁止硬编码
© OpenLoaf, AGPL-3.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in apps/server/src/ai/builtin-skills/workbench-ops of OpenLoaf/OpenLoaf.
Open the folder on GitHubat commit f7eccf6
Compare with similar skills
Workbench Ops Skill next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Workbench Ops Skill this skillOpenLoaf/OpenLoaf | 107 | — | ~744 | Automated safety check: Notes | AGPL-3.0 | |
| MCP Server Builderanthropics/skills | 180k | 62 repos | ~2.3k | Automated safety check: Pass | Apache-2.0 | |
| Web Artifacts Builderanthropics/skills | 180k | 40 repos | ~769 | Automated safety check: Pass | Apache-2.0 | |
| Typescript Advanced Typesrolling-scopes/rsschool-app | 10k | 24 repos | ~4.2k | Automated safety check: Pass | MPL-2.0 | |
| Code Review ChecklistshareAI-lab/learn-claude-code | 78k | 5 repos | ~1.1k | Automated safety check: Pass | MIT | |
| MCP Server BuildershareAI-lab/learn-claude-code | 78k | 5 repos | ~1.2k | Automated safety check: Pass | MIT |
Similar skills
- Official
- Official
Web Artifacts Builder
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
Typescript Advanced Types
rolling-scopes/rsschool-app
Master TypeScript's advanced type system including generics, conditional types, mapped types, template literals, and utility types for building type-safe applications.
Code Review Checklist
shareAI-lab/learn-claude-code
Reviews code against a five-part checklist covering security, correctness, performance, maintainability and testing, and reports findings in a fixed format.
MCP Server Builder
shareAI-lab/learn-claude-code
Walks through building MCP servers in Python or TypeScript that expose tools, resources and prompts to Claude, with templates, registration and testing.
Nx Import
nrwl/nx
Import, merge, or combine repositories into an Nx workspace using nx import.
More from OpenLoaf/OpenLoaf
All 34 skills in this repoAgent Orchestration Skill
OpenLoaf/OpenLoaf
Triggers when the master Agent faces a multi-step complex task and is deciding whether / how to outsource sub-tasks to built-in subagents (browser / doc-editor / data-analyst / extractor /…
Browser Ops Skill
OpenLoaf/OpenLoaf
Triggered when the user asks for page-level interaction with a specific webpage: login, form filling, button clicks, pagination scraping, screenshots, downloading page images, handling CAPTCHAs or…
Canvas Ops Skill
OpenLoaf/OpenLoaf
Triggered when the user wants lifecycle management of OpenLoaf canvases / whiteboards: create, open, filter, duplicate, delete, rename, or change ownership.
Word Document Read, Write and Convert
OpenLoaf/OpenLoaf
Reads, edits, converts and reviews Word documents through three dedicated tools, covering tracked changes, comments, tables, images and format conversion.
Email Operations
OpenLoaf/OpenLoaf
Handles a real email account through query and mutate tools: check the inbox, read, search, reply, forward, compose and organize, with sending always confirmed first.
macOS Desktop Control
OpenLoaf/OpenLoaf
Guides an agent to operate native macOS apps by surveying an app first, acting through intents, menus or keystrokes, and verifying each step, in OpenLoaf Desktop only.
Related
Works with
Questions about Workbench Ops Skill
What does Workbench Ops Skill do?
当用户要在 OpenLoaf 工作台 / 桌面上新增、修改、查看、删除 widget（桌面组件 / 小组件 / 仪表盘卡片）时触发。典型说法"加个天气 widget"、"做个番茄钟组件"、"改下这个 widget 的颜色"。不用于：聊天消息里一次性展示图表（→visualization-ops-skill）、AI 生成图片（→cloud-media-skill）、对话里随口提到"时钟 /…. Workbench Ops Skill is an agent skill from OpenLoaf/OpenLoaf.
How do I install Workbench Ops Skill in Claude Code?
Run `npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a claude-code`. Or copy the skill folder (apps/server/src/ai/builtin-skills/workbench-ops in OpenLoaf/OpenLoaf) into .claude/skills/workbench-ops-skill in your project. Claude Code loads it when a task matches its description.
How do I install Workbench Ops Skill in Codex?
Run `npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a codex`. Or copy the skill folder (apps/server/src/ai/builtin-skills/workbench-ops in OpenLoaf/OpenLoaf) into .agents/skills/workbench-ops-skill in your project. Codex loads it when a task matches its description.
Can I use Workbench Ops Skill in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add OpenLoaf/OpenLoaf --skill workbench-ops-skill -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/workbench-ops-skill, .gemini/skills/workbench-ops-skill, .github/skills/workbench-ops-skill and .opencode/skills/workbench-ops-skill in your project.
What does Workbench Ops Skill need to run?
SKILL.md names no scripts, command-line tools or credentials: Workbench Ops Skill is instructions for the agent only.
Does Workbench Ops Skill access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is Workbench Ops Skill safe to install?
Our automated static check of SKILL.md found notes only (mentions a .env file), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.
What licence does Workbench Ops Skill use?
Workbench Ops Skill is published under the AGPL-3.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Workbench Ops Skill use?
About 744 tokens (SKILL.md is roughly 3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Workbench Ops Skill?
Skills that share tags, products or a category with Workbench Ops Skill: MCP Server Builder (anthropics/skills, 180k stars), Web Artifacts Builder (anthropics/skills, 180k stars), Typescript Advanced Types (rolling-scopes/rsschool-app, 10k stars) and Code Review Checklist (shareAI-lab/learn-claude-code, 78k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Workbench Ops Skill?
OpenLoaf (a GitHub organization) maintains it in OpenLoaf/OpenLoaf, which has 107 GitHub stars. The repository holds 34 skills in this directory. The repository was last updated on May 14, 2026.
Source: OpenLoaf/OpenLoaf on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.