Clowder AI is a self-hosted workspace where AI agents from different model families work together as a persistent team, retaining identities, shared evidence, and memory across tasks. It is for people who want to coordinate multiple AI agents without repeatedly rebuilding their context.
Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add zts212653/clowder-ai --skill pencil-designgit clone --depth 1 https://github.com/zts212653/clowder-aiWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/zts212653/clowder-ai/pencil-design)<a href="https://agentmods.dev/skills/zts212653/clowder-ai/pencil-design"><img src="https://agentmods.dev/badge/skills/zts212653/clowder-ai/pencil-design/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/zts212653/clowder-ai/pencil-design"><img src="https://agentmods.dev/badge/skills/zts212653/clowder-ai/pencil-design.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00078 | $0.02178 |
| Opus 5 | $0.00039 | $0.01089 |
| Sonnet 5 | $0.00016 | $0.00436 |
| Haiku 4.5 | $0.00008 | $0.00218 |
Grade A, and why
pencil-design scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 160 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Pencil Design — .pen 文件设计与代码导出
核心知识
Pencil 是装在 Antigravity IDE 上的设计扩展。 .pen 文件是加密格式，只能通过 Pencil MCP 工具读写，Read/Grep/cat 无法解析。
配置要求：当前 Antigravity IDE 的 MCP 参数是 --app antigravity_ide；
VS Code 是 --app visual_studio_code。不要沿用旧的 antigravity / vscode
socket 标识；Clowder AI 的 resolver 会按扩展安装目录自动生成正确参数。
SOP 位置
feat-lifecycle → Design Gate → **pencil-design** → writing-plans → worktree → tdd
pencil-design 在 spec 确认后、写代码前。先把 UX 做对，再动手写代码。
可观测性 / 状态 / 失败相关 UI 必读：动手画之前先过 Design Gate 的 现场可感知性自检（../.cat-cafe-shared-refs/in-context-observability-checklist.md）。Clowder AI 的可观测性哲学是"明厨亮灶"——in-context 富块 + entity 自带状态点优先于 dashboard。否则容易画成上个世纪的 stats card 被打回（F174 D2b 教训）。
🔴 风格一致性门禁（Style Consistency Gate）
这是最重要的规则。 在创建任何新设计之前，必须完成以下步骤：
Step 1: 分析现有 UI
如果要设计的功能是已有产品的扩展（如给 Mission Hub 加新 Tab）：
- 截图现有 UI — 用 Read 工具查看产品截图，或在浏览器中截图
- 提取风格特征 — 记录以下 token：
- 配色方案（背景色、主色、强调色）
- 布局模式（列表/卡片/详情面板、Tab 结构）
- 间距和圆角
- 字体层级
- 写入设计约束 — 在 batch_design 前明确："延续 X 风格"
Step 2: 判断设计类型
| 类型 | 做法 | 例子 |
|---|---|---|
| 扩展现有产品 | 必须复用现有风格，作为现有界面的自然延伸 | 给 Mission Hub 加 Tab |
| 全新独立产品 | 可以用 get_style_guide_tags + get_style_guide 探索新风格 |
新的独立工具 |
| 重新设计 | 先对比旧设计和新方向，operator确认后再动手 | 产品改版 |
Step 3: 风格验证
设计完成后，get_screenshot 截图，然后和现有 UI 截图并排对比：
- 配色一致？
- 布局语言一致（Tab/列表/详情面板）？
- 不会让用户觉得"换了个产品"？
踩坑教训 (F076)：给 Mission Hub 做面板时用了深色 command-center 风格，和现有暖色调 Mission Hub 完全不搭，operator experience"不能说一模一样，只能说毫不相关"。被否决后全部重做。
两种模式
Mode A：Design — 创建/编辑 .pen 文件
用 Pencil MCP 工具操作设计画布：
| 工具 | 用途 |
|---|---|
get_editor_state |
查看当前画布状态（首先调用） |
open_document |
打开已有 .pen 文件（"new" 不落盘，需用户手动 Cmd+S） |
batch_get |
批量读取 layer/component 属性 |
batch_design |
批量创建/修改设计元素（每次最多 25 ops） |
get_screenshot |
获取当前画布截图（验证设计结果） |
get_guidelines |
获取布局参考线 |
get_style_guide |
获取项目色系/字体规范 |
关键限制：
batch_design每次最多 25 ops，超出必须分批调用- Binding（绑定引用）不能跨
batch_design调用复用 - MCP 配置改动需等下次调用才生效（无头模式）
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago Changed · +2 lines 073d4c939fcb
- 10d ago First seen · 158 lines · 78 tokens per session scan A 53660828a80d
pencil-design is a skill published in the GitHub repository zts212653/clowder-ai (2,956 stars, last pushed today), licensed MIT. It adds 78 tokens to every session and 2,178 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
webgl-holographic-foil
A self-contained WebGL2 hero: thin-film interference over a crushed-foil surface whose palette shifts with the viewing angle; move the cursor to tilt the film.
html-ppt-hermes-cyber-terminal
OpenDesign + BYOK: choosing and wiring your own model, hands-on — cost, quality, and the routing decision. Built as a decision-grade AI literacy deck for engineers, IT, applied-AI teams.
html-ppt-taste-brutalist
16:9 HTML deck in tactical-telemetry / CRT-terminal taste. Deactivated-CRT charcoal slides, white-phosphor monospace, hazard-red accent, scanline overlay, ASCII syntax, density over decoration. Distilled from Leonxlnx/taste-skill brutalist-skill (Tactical Telemetry mode).
visual-ralph
Visual Ralph orchestration for frontend UI from generated references, static references, or live URL targets, using $ralph with built-in visual verdict and pixel-diff evidence until the implementation matches and leaves a reproducible design system.
accessibility
Consolidated accessibility skill entrypoint for WCAG 2.2, ARIA Authoring Practices, cognitive accessibility, Section 508, EN 301 549, design intent verification, and the Accessibility Planner workflow.
make-resume
A Chinese-language tool for creating editable HTML resumes that can be changed in a browser and printed to PDF. It uses available resume templates when they are installed and otherwise provides a simpler fallback.