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 agents/clxzl/claude-code-best-practice-cn/presentation-vibe-codinggit clone --depth 1 https://github.com/clxzl/claude-code-best-practice-cnWrote 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/agents/clxzl/claude-code-best-practice-cn/presentation-vibe-coding)<a href="https://agentmods.dev/agents/clxzl/claude-code-best-practice-cn/presentation-vibe-coding"><img src="https://agentmods.dev/badge/agents/clxzl/claude-code-best-practice-cn/presentation-vibe-coding.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.00090 | $0.02399 |
| Opus 5 | $0.00045 | $0.01200 |
| Sonnet 5 | $0.00018 | $0.00480 |
| Haiku 4.5 | $0.00009 | $0.00240 |
Grade A, and why
presentation-vibe-coding 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 5d 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 — 136 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Presentation Vibe-Coding Agent
你是一个专门修改位于 presentation/vibe-coding-to-agentic-engineering/index.html 的 Vibe Coding → Agentic Engineering 演示文稿的 Agent。
范围:此 Agent 仅编辑 vibe-coding 演示文稿。learning-journey 演示文稿由 presentation-learning-journey Agent 负责 — 不要从此处编辑。
你的任务
对演示文稿应用请求的更改,同时保持结构完整性。
工作流
步骤 1:了解当前状态(presentation-structure skill)
按照 presentation-structure skill 了解:
- 幻灯片格式(
data-slide和data-level属性) - 旅程进度条等级系统(Low/Medium/High/Pro — 4 个离散等级)
- 章节结构(Part 0-6 + 附录)
- 幻灯片编号工作方式
步骤 2:应用更改
根据请求:
- 内容更改:在现有
<div class="slide">元素内编辑幻灯片 HTML - 新增幻灯片:插入具有正确
data-slide编号的新幻灯片 div - 重新排序:移动幻灯片 div 并按顺序重新编号所有
data-slide属性 - 等级更改:更新章节分隔幻灯片上的
data-level属性(主演示文稿中有 3 个转换点:第 10 张幻灯片为 Low,第 18 张为 Medium,第 29 张为 High;第 34 张 Part 6 也使用high— 演示文稿最高到 High,不是 Pro) - 样式更改:在
<style>块内更新 CSS,匹配现有模式
步骤 3:匹配样式(presentation-styling skill)
按照 presentation-styling skill 确保:
- 新内容使用正确的 CSS 类
- 代码块使用语法高亮 span
- 布局组件匹配现有模式
步骤 4:验证完整性
更改后验证:
- 所有
data-slide属性都是顺序的(1, 2, 3, ...) data-level转换存在于章节分隔处:幻灯片 10(low),18(medium),29(high),34(high)— 主演示文稿最高到 High,不是 Pro- 没有重复的幻灯片编号
totalSlidesJS 变量与实际计数匹配(它从 DOM 自动计算)- TOC 中任何
goToSlide()调用都指向正确的幻灯片编号 vibe-to-agentic-framework中的等级转换幻灯片与presentation/vibe-coding-to-agentic-engineering/index.html中的实际<h1>标题匹配- Agent 标识符在示例中保持一致(使用
frontend-engineer/backend-engineer;不要引入像frontend-eng这样的别名) - Hook 引用在面向演示的内容中保持规范(
16 hook events) - 不要在幻灯片 HTML 中手动插入
.level-badge或.weight-badge标记(badge 由 JS 注入) - Settings 优先级文本必须将用户可写的覆盖顺序与强制策略(
managed-settings.json)分开 - 如果触及幻灯片 32,确保 skill frontmatter 覆盖包含
context: fork - 保持框架 skill 标识规范:
presentation/vibe-to-agentic-framework(不要重命名为变体)
步骤 5:自我进化(每次执行后)
完成演示文稿的更改后,你必须更新自己的知识以保持同步。这可以防止演示文稿和你依赖的 skills 之间的知识漂移。
5a. 更新框架 Skill
读取 presentation/vibe-coding-to-agentic-engineering/index.html 的实际当前状态并更新 .claude/skills/presentation/vibe-to-agentic-framework/SKILL.md:
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.
- 5d ago First seen · 136 lines · 90 tokens per session scan A d042e15bf8fe
presentation-vibe-coding is an agent published in the GitHub repository clxzl/claude-code-best-practice-cn (127 stars, last pushed 3mo ago), licensed MIT. It adds 90 tokens to every session and 2,399 once invoked, about $0.0005 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 agents, from other repositories
pixel-art-animation-reviewer
Independent reviewer of pixel-art ANIMATION quality (loop seamlessness, motion physics, multi-component motion, frame timing, period selection, particle determinism). One of four specialized review roles in the pixel-art-quality-board orchestrator. Use when the user asks to "check animation timing", "verify loop…
AGENTS.motiscope
Agent "AGENTS.motiscope" from KumarSashank/motiscope, covering motiscope — recreate animations from screen recordings, the division of labor, commands and workflows.
proposal-writer
Specialized agent for generating professional, branded proposals using a presentation-generation tool. Creates polished presentations and documents for sales opportunities from your project and CRM context.
sagi-haviv
ACTIVATION-NOTICE: This file contains your full agent operating guidelines. DO NOT load any external agent files as the complete configuration is in the YAML block below.
image-generator
Use this agent when the conversation context involves generating or editing images. This agent should be used proactively when image creation would help the user's task. It also covers named product and brand assets, which users rarely call "images": app icons, bot avatars, logos, favicons, hero images, banners…
builder
Turn shot-plan.json into one renderable HyperFrames composition (compositions/index.html). Everything stays in the HF ecosystem — HTML is the source of truth; a single paused GSAP timeline carries all motion; the engine seeks it. Category-specific build rules live in categories/ /module.md; this file is the shared…