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 agentmods add skills/zhenheco/design-lab/skillnpx skills add zhenheco/design-lab --skill skillgit clone --depth 1 https://github.com/zhenheco/design-labWrote 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/zhenheco/design-lab/skill)<a href="https://agentmods.dev/skills/zhenheco/design-lab/skill"><img src="https://agentmods.dev/badge/skills/zhenheco/design-lab/skill.svg" alt="Measured on agentmods" height="20"></a>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 | $0.00091 | $0.03746 |
| Opus 5 | $0.00046 | $0.01873 |
| Sonnet 5 | $0.00018 | $0.00749 |
| Haiku 4.5 | $0.00009 | $0.00375 |
Grade C, and why
design-lab scanned grade C with 3 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 3d 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.
Asks for rootmediumPrivilege escalation
A mod that escalates privileges can change anything on the machine, not only the project.
- token 寫到 `$HOME/.claude/state/design-lab/api-token`,`umask 077` + `chmod 600`。 Reads agent configuration directoriesmediumAgent snooping
.claude/, .codex/, .gemini/ hold keys, settings and other credentials a mod has no legitimate need for.
TOKEN="$(cat "$HOME/.claude/state/design-lab/api-token")" Makes network callslowCapability
Not a fault in itself. Listed so you know the mod talks to something, and to what.
curl -s "http://127.0.0.1:5174/api/context?client=$CLIENT&scenario=$SCENARIO" \ How it starts
The opening of the file, as written. The whole thing — 271 lines — stays where its author put it; the contents beside it link to each section on GitHub.
design-lab v0.3 — sidecar auto-auth 架構
個人化品牌設計系統。三大組件:
- Multi-client vault:v0.2 schema_version=2,每個 client 獨立
cases/+anti-library/,retrieval scope 自動 union(type:self clients 跨 client 共享)。 - Sidecar daemon(Express + SQLite + chokidar,
localhost:5174):watch vault → SQLite cache → 5 個 API + dashboard SSR mount;v0.3 起有 host allowlist + write-route token auth。 - Local dashboard(Astro 5 SSR + Tailwind 4,從 sidecar 同 port serve):4 page UI(overview / clients CRUD / case grid / style-guide editor),SSR 注入 API token 給 CSR fetch。
Memory 庫位置:~/Documents/CC Cli/design-library/(Obsidian vault 內)。
啟動 hook
每個 slash command 第一個動作都跑 schema check;v0.3 起 /design 在 schema check 後會自動 ensure sidecar,讓 Open Design bridge skill 在 generation pre-flight 可抓 context:
bash $SKILL_DIR/scripts/check-schema.sh "$HOME/Documents/CC Cli/design-library"
退出碼 2 = 提示用戶跑 migration;退出碼 1 = 致命錯誤;退出碼 0 = 繼續。
如 vault 不存在:先跑 bash $SKILL_DIR/scripts/init-library.sh "$HOME/Documents/CC Cli/design-library" 初始化(v0.2 結構:clients/_personal/、scenario-overrides/、personal-style-guide.md)。
如 vault 是 v1 結構(root cases/ + anti-library/,無 clients/):check-schema 會提示跑 bash $SKILL_DIR/scripts/migrate-v1-to-v2.sh "$HOME/Documents/CC Cli/design-library",自動把 root cases 搬到 clients/_personal/cases/,sibling 備份原 vault。
/design 專用 auto-spawn:
bash $SKILL_DIR/scripts/ensure-sidecar.sh
spawn 失敗時 design.sh fail soft,只提示 bridge 將 fallback 到 no-memory generation,不阻塞本次 design。
Slash commands(v0.3 只保留 2 個)
/design <task description> — 主入口
做什麼:根據任務描述,組 brand.yaml token > personal-style-guide > taste-overrides > taste-skill baseline 的 design context,從個案庫抽相似 case,產出 design。
執行:
bash $SKILL_DIR/scripts/design.sh "<task description>"
design.sh 行為:
- 跑 schema check(exit 2 提示 migration / exit 1 致命)
- v0.3: 開頭自動
ensure-sidecar.sh(fail soft),給 bridge skill 抓 context;cold spawn 會產生 token 並啟 sidecar - 印 task description
- 印
composed-design-context:brand.yaml tokens、personal-style-guide、taste-overrides、section-filtered taste-skill baseline - 透過
node --import tsx載入lib/case-loader.ts,輸出cases/ frontmatter summary(含 client / slug / scenario / quotes / tags / palette) - 印 case_count(用
find clients/*/cases/*.md)+ fallback flag - 印 INSTRUCTIONS:Claude 從 summary 挑 top 5 → 載 scenario-override → 產出 design → 跑 lint
What ships with it
60 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- dashboard/.gitignore 28 B
- dashboard/astro.config.mjs 1.5 KB runs code
- dashboard/package-lock.json 285 KB
- dashboard/package.json 878 B
- dashboard/src/components/CaseFilter.tsx 2.6 KB
- dashboard/src/components/CaseGrid.astro 2.1 KB
- dashboard/src/components/ClientCrudForm.tsx 9.5 KB
- dashboard/src/components/ClientSwitcher.tsx 2.8 KB
- dashboard/src/components/StyleGuideEditor.tsx 4.2 KB
- dashboard/src/layouts/BaseLayout.astro 942 B
- dashboard/src/lib/api.ts 6.2 KB runs code
- dashboard/src/pages/clients/[slug].astro 3.2 KB
- dashboard/src/pages/clients/index.astro 7.0 KB
- dashboard/src/pages/index.astro 3.8 KB
- dashboard/src/pages/style-guide.astro 1.1 KB
- dashboard/src/styles/global.css 296 B
- dashboard/tests/components/api-auth.test.ts 2.4 KB runs code
- dashboard/tests/components/CaseFilter.test.tsx 3.2 KB
- dashboard/tests/components/ClientCrudForm.test.tsx 5.2 KB
- dashboard/tests/components/StyleGuideEditor.test.tsx 6.0 KB
- dashboard/tests/setup.ts 835 B runs code
- dashboard/tsconfig.json 215 B
- dashboard/vitest.config.ts 366 B runs code
- launchd/co.zhenhe.designlab.sidecar.plist.template 873 B
- lib/.keep 0 B
- lib/capture/url-capture.ts 7.0 KB runs code
- lib/case-loader.ts 8.1 KB runs code
- lib/case-writer.ts 3.9 KB runs code
- lib/client-loader.ts 4.4 KB runs code
- lib/client-writer.ts 8.9 KB runs code
- lib/distill/aspect-aggregator.ts 3.6 KB runs code
- lib/distill/render-taste-overrides.ts 2.4 KB runs code
- lib/distill/run-distill.ts 4.2 KB runs code
- lib/distill/verdict.ts 606 B runs code
- lib/feedback-log.d.ts 401 B runs code
- lib/feedback-log.js 879 B runs code
- lib/index/db.ts 2.9 KB runs code
- lib/index/reindex.ts 17 KB runs code
- lib/index/watcher.ts 3.9 KB runs code
- lib/last-artifact.js 730 B runs code
- lib/lint.d.ts 420 B runs code
- lib/lint.js 2.8 KB runs code
- lib/paths.ts 1.9 KB runs code
- lib/schema.d.ts 40 B runs code
- lib/schema.js 181 B runs code
- lib/stats.d.ts 274 B runs code
- lib/stats.js 731 B runs code
- lib/theme-palette.ts 681 B runs code
- mcp/server.ts 5.6 KB runs code
- mcp/sidecar-client.ts 3.1 KB runs code
- mcp/start.sh 364 B runs code
- mcp/tools.ts 4.3 KB runs code
- migrations/README.md 638 B
- migrations/v1-to-v2.md 1.4 KB
- scripts/.keep 0 B
- scripts/check-schema.sh 1.1 KB runs code
- scripts/collect.sh 2.1 KB runs code
- scripts/design.sh 8.2 KB runs code
- scripts/distill.sh 252 B runs code
- scripts/ensure-sidecar.sh 3.2 KB runs code
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.
- 3d ago First seen · 271 lines · 91 tokens per session scan C 3cf8f7bf1f61
design-lab is a skill published in the GitHub repository zhenheco/design-lab (8 stars, last pushed 22d ago), licensed MIT. It adds 91 tokens to every session and 3,746 once invoked, about $0.0005 per session on Opus 5. A static security scan graded it C with 3 findings (asks for root, reads agent configuration directories, makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
material-ui-tailwind
Integrates Material UI with Tailwind CSS v4 using cascade layers (enableCssLayer, @layer order) and documents Tailwind v3 interoperability (preflight, important, injectFirst, portals). Use when combining MUI with Tailwind utilities, slotProps className, or theme token bridges.
daisyui-config
Configuration options for daisyUI 5.
create-component
End-to-end SEED component implementation guide for React Web, Lynx, and cross-platform work. Use when adding or changing components across rootage, qvism, react/lynx packages, registry snippets, docs, examples, or when writing/refactoring docs/stories Storybook files. Story-only work follows a CSF Next fast path…
designlang-tokens
Use when styling UI for cal.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
design-negotiation
Advocate for design quality, scope, and timeline with partners and leadership using evidence and shared goals. Use in the conversation itself. For the commercial vocabulary behind it, use business-design (ux-strategy).
version-control-strategy
Define version control for design files, components, and libraries — branching, naming, and release. Use when file history is chaotic. For design system contribution rules, use design-system-governance (design-systems).