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 EthanYoQ/Skill-hub --skill yq-editorial-presentation-htmlgit clone --depth 1 https://github.com/EthanYoQ/Skill-hubWrote 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/ethanyoq/skill-hub/yq-editorial-presentation-html)<a href="https://agentmods.dev/skills/ethanyoq/skill-hub/yq-editorial-presentation-html"><img src="https://agentmods.dev/badge/skills/ethanyoq/skill-hub/yq-editorial-presentation-html/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/ethanyoq/skill-hub/yq-editorial-presentation-html"><img src="https://agentmods.dev/badge/skills/ethanyoq/skill-hub/yq-editorial-presentation-html.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.00131 | $0.05846 |
| Opus 5 | $0.00066 | $0.02923 |
| Sonnet 5 | $0.00026 | $0.01169 |
| Haiku 4.5 | $0.00013 | $0.00585 |
Grade A, and why
yq-editorial-presentation-html 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 10d 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 — 321 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Editorial Presentation (HTML + PPTX 双模)
这个 skill 是什么
一套可规划、可验证、可变体的视觉设计语言 skill，源自 Pfizer 血液科 IFI 案例分享 v5 desktop 版，并把单一成品样式拆成稳定 DNA 与可选 style profile。
核心价值：先按受众、目的、正式度、密度和语义关系规划，再渲染 HTML/PPTX。复用的是编辑设计原则、角色化 token、构图语法与质量门，不是把不同主题替换进同一套米色卡片模板。
双输出模式:
- HTML 模式（默认）：用于浏览器演示的横向全屏 deck。F11 下每页固定 100vw × 100vh，支持左右翻页、底部圆点、触屏/滚轮、ESC overview，并完整支持 profile 与构图语法。
- PPTX 模式：用于必须交 .pptx 文件的场景（高管会、客户演示、传统企业）。通过 python-pptx 程序化生成，与 HTML 共用 manifest；只选择明确支持 PPTX 的 profile。
两种模式共享的设计 DNA：
- 温暖但克制的编辑质感、证据可读性和固定 16:9 舞台。
- display / body / data 三类字体角色；具体字族由 profile 决定，原始 Pfizer profile 仍使用 Fraunces / Inter / JetBrains Mono。
- 颜色通过 canvas / surface / ink / primary / secondary / signal / positive / negative 等角色分配，不锁死一组 RGB。
- 先判断数据关系、基数、密度、不确定性和叙事角色，再分别选择表达家族与构图。
- 同一 profile 内保持一致，但相邻页面不得机械复用相同构图、几何和背景节奏。
- HTML 与 PPTX 共用同一份 slide manifest；格式降级必须记录，不能全部退化为卡片网格。
何时使用(必须主动触发,不要等用户说风格名)
任一信号出现时使用：
- 明确要求 "warm editorial / Anthropic / Pfizer / 编辑设计 / 类似血液科那套"
- "做一个 presentation / slides / PPT / 幻灯片 / 演示文稿 / 汇报" 且上下文要求高规格视觉设计
- "做 case sharing / 案例分享 / 项目展示 / 战略汇报"
- "给老板/director/VP 看 / 给客户演示"
- "类似血液科那套 / Pfizer 风格 / Anthropic 风格 / warm editorial / 编辑设计风格"
- "把 X 内容做成可演示的页面 / 做成 deck"
- 用户给一份内容(产品发布、市场调研、技术分享、案例复盘),需要做成展示
普通 PPT 编辑、只改一行文字或用户已指定另一套视觉系统时不要抢占。触发后也先选择 profile 与构图语法，不默认套原始 Pfizer 配色。
第 0 步:判断输出格式
问自己 / 看用户表述:
| 用户说... | 用 |
|---|---|
| "做 HTML 页面 / 网页 / 浏览器演示 / F11 全屏 / 加跳转链接 / 嵌入视频" | HTML 模式 |
| "做 PPT / .pptx / PowerPoint / 幻灯片文件 / 给传统企业用" | PPTX 模式 |
| "做 presentation"(没说格式) | 默认 HTML 模式(更高保真),并主动问"要不要也出一份 PPT 版?" |
| "做一份给客户演示用的"(看上下文) | 客户是 IT/科技 → HTML;客户是医药/金融/政府 → PPTX |
| "做幻灯片样式"但没说文件类型 | HTML 模式(横向全屏 deck) |
如果不确定,默认 HTML(因为它复刻度最高,后续可再衍生 PPT)。
HTML 模式工作流
Step 1 · 读 references
按需读:
references/visual-grammar.md必读 — profile 选择、密度模式、slide manifest、构图语法与反重复质量门。references/style-index.json必读 — 只做 shortlist；选定后只把一个 profile 的角色 token 带入生成上下文。references/design-tokens.md必读 — invariant token 与 profile 角色映射。只有用户锁定原始 Pfizer look 时才原样使用 legacy token block。references/typography.md必读 — display / body / data 角色与 projection scale；具体字族来自选定 profile。references/chart-selection.md必读 — 图表选择规则。先判断数据关系,再选 stat / timeline / matrix / funnel / bar 等组件。禁止把所有数字都画成条形图。references/components.md— 视觉组件的 HTML+CSS 切片,包含每类组件的"何时用 / 不何时用"。references/layouts.md— 横向全屏 deck 的 slide 节奏、grid 布局、navigation。references/rewrite-existing-html.md— 改写已有 HTML deck 的专用流程。保留内容 section,只替换演示 shell / CSS / JS。references/qa.md— 生成后检查。重点查主内容宽度、垂直沉底、页脚遮挡、overview 和滚动条。
What ships with it
24 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.
- assets/deck-shell.html 5.7 KB
- assets/embed_pptx_fonts.ps1 4.0 KB runs code
- assets/generate_pptx.py 73 KB runs code
- assets/plan_deck.py 11 KB runs code
- assets/render_manifest.py 21 KB runs code
- assets/starter-template.html 24 KB
- evals/evals.json 9.0 KB
- evals/files/eleven-section-source.html 1.0 KB
- README_zh.md 5.3 KB
- README.md 4.8 KB
- references/chart-selection.md 4.6 KB
- references/checklist.md 3.0 KB
- references/components.md 29 KB
- references/design-tokens.md 8.1 KB
- references/layouts.md 6.0 KB
- references/pptx-mode.md 15 KB
- references/qa.md 3.6 KB
- references/rewrite-existing-html.md 5.5 KB
- references/style-index.json 5.2 KB
- references/typography.md 11 KB
- references/visual-grammar.md 6.6 KB
- screenshots/01_hero.png 351 KB
- screenshots/03_evidence_pyramid.png 237 KB
- screenshots/04_architecture.png 167 KB
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.
- 10d ago First seen · 321 lines · 131 tokens per session scan A 7f1bea91f480
yq-editorial-presentation-html is a skill published in the GitHub repository EthanYoQ/Skill-hub (9 stars, last pushed 3d ago), licensed MIT. It adds 131 tokens to every session and 5,846 once invoked, about $0.0007 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-31.
Other skills, from other repositories
skin-creator
Create and apply a two-asset LobsterAI visual skin from the user's style description. Use only when the AI Skin Designer kit supplies the structured skinpack workflow marker; do not use for ordinary theme or image requests.
design
Use when the user wants the visual/experiential design of a product done systematically — a design system, a screen, a landing page, or a visual identity — grounded in researched real-world prior art and free of AI slop. Establishes/extends the design system, invokes the matching local taste skill, dispatches the…
canvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
cli-anything-photoshop
A command-line tool that controls Adobe Photoshop through Windows automation. It can work with Photoshop documents, layers, selections, text, image adjustments, and exports.
nextclaw-skin-studio
A studio for browsing, applying, creating, refining, switching, inspecting, and removing custom NextClaw skins. A skin changes an app's visual appearance and can include CSS, JavaScript, images, SVG, layout changes, and motion.
canvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.