1实现原理 · 为什么它能做到
该 skill 是 html-anything 的「模板包」：frontmatter 供选择器取元数据，SKILL.md 正文（frontmatter 之后的 body）被 loader 原样读出后作为模型指令。
next/src/lib/templates/loader.ts
const { fm, body } = parseFrontmatter(raw);
注：本模板正文 49 行 / 4865 字节（本批最重的模板：4 套主题 + 22 个版面 + 铁律段）；frontmatter 走 parseFrontmatter 拆成 fm/body 两份，目录内没有任何脚本参与。
真正送进模型的 prompt = 共享设计指令 + 本模板正文 + 【输入格式】+【用户内容】；共享指令还带一条覆盖规则，声明模板里的页数/版面数字不是上限。
next/src/lib/templates/shared.ts
return `${SHARED_DESIGN_DIRECTIVES} ${opts.body.trim()}
注：同文件里紧随的覆盖规则逐字写着：模板只定义"可用版面 / 风格 / 配色 / 字体 / 组件库", **不定义** slide / 帧 / 卡片 / section 的数量。
产出纪律由共享指令硬性约束：禁止 agent 使用任何文件系统工具，HTML 必须以 stdout 文本流式输出、由前端落盘。
next/src/lib/templates/shared.ts
- **禁止使用 Write / Edit / MultiEdit / Bash / Create / 任何文件系统工具**。不要把 HTML 写到任何
注：本模板自身不声明落盘方式，完全依赖这条共享约束。
风格靠「4 套主题二选一」锁定：Klein Blue (IKB) / Lemon Yellow / Lemon Green / Safety Orange，每套给 accent+paper+ink 三色，不许混用不许改 hex。
next/src/lib/templates/skills/deck-swiss-international/SKILL.md
- 🔵 **Klein Blue (IKB)** — accent `#002FA7`, paper `#fafaf8`, ink `#0a0a0a`. 商业 / AI / 设计场景。
注：正文还规定 Lemon 系主题文字必须黑色、Safety Orange 文字用白色且 bold ≥ 600——把可读性写成主题约束。
22 个锁死版面（S01 Cover … S22 Image Hero）构成可复用版式池：封面全屏 accent、KPI Tower 变高柱、Duo Compare 前后对比等。
next/src/lib/templates/skills/deck-swiss-international/SKILL.md
- **S06 KPI Tower** — 4 列变高蓝色柱状; 柱顶 icon; 柱底大数字 + 标签。
注：正文写「数量由内容决定」：短内容 6-10 张起，长内容远超，同一版式可跨章节重复。
铁律段把风格写成可检验规则：只用直角（border-radius: 0）、1px hairline、16 列网格、字号极端反差、不许编造数字。
next/src/lib/templates/skills/deck-swiss-international/SKILL.md
- **只用直角**: 全程 `border-radius: 0`。圆角 = 立刻违反。
注：同段还有「- **16 列网格**: `grid-template-columns: repeat(16, 1fr); gap: 0`。」与「- **不许编造**: 数字必须来自用户输入, 图表柱高 = 真实数据按比例。」
来源为第三方移植并保留署名：frontmatter 记 example_source_url = op7418/guizang-ppt-skill，README 第三方来源表同步登记「Original LICENSE + authorship preserved」。
next/src/lib/templates/skills/deck-swiss-international/SKILL.md
example_source_url: "https://github.com/op7418/guizang-ppt-skill"
注：README 同时说明本模板是该上游的 Swiss 变体（Style B）。
2核心能力
0122 个锁死版面池（S01 Cover 到 S22 Image Hero），数量由内容决定、版式可跨章节重复
024 套主题二选一 + 固定 hex（Klein Blue #002FA7 / Lemon Yellow #FFD500 / Lemon Green #C5E803 / Safety Orange #FF6B35）
0316 列网格（repeat(16, 1fr), gap: 0）+ 1px hairline，禁阴影/渐变/blur
04全程直角：border-radius 必须为 0
05字号极端反差：cover 用 9.6vw display、body 14-16px、label 11px uppercase + letterspacing 0.08em
06字体族限定为 Inter Tight / Inter / Noto Sans SC / JetBrains Mono，严禁衬线
07数据诚实条款：图表柱高必须按真实数据比例，数字只能来自用户输入
08键盘 ← / → 翻页 + hash 同步 + №N/N 角标；单文件 HTML、禁外部图片（装饰几何用纯 CSS/内联 SVG）
09站点侧权重最高：featured 50 / recommended 2，README 首屏截图位与详情页截图都由它承担
3外部依赖
| 类型 | 依赖 |
|---|---|
| cli | 宿主本机 agent CLI（应用侧 spawn；非本 skill 指令） |
| network | Tailwind CDN（产物示例引用，非 skill 正文要求） |
| network | Google Fonts（产物示例引用） |
| network | 出处置标（frontmatter 元数据，非调用） |
4风险提醒 风险提醒：绿色 · 放心使用
风险提醒：绿色 · 放心使用
- 22 版面 + 4 主题 + 6 铁律的正文较长，弱模型可能只实现子集 — 4865 字节规格需在单次生成里全部兑现；规格越长，遗漏概率越高（例如漏掉「只用直角」）。
- 风格极冷，与「有温度」的沟通场景不匹配 — 正文自述「极度冷静、理性、学院派, 没有任何手绘 / 噪点 / 装饰」——情感型汇报会被压成数据感。
- 样例产物仍引 Tailwind CDN 与 Google Fonts（产物引用） — example.html 含 cdn.tailwindcss.com 远程 script 与 fonts.googleapis.com @import；与正文「不用任何外部图片 URL」不冲突（是脚本/字体非图片），但离线预览时样式可能退化。
- 预览 iframe 的 sandbox 组合偏宽（宿主侧） — template-picker.tsx:544 / preview-pane.tsx:297 = sandbox="allow-scripts allow-same-origin"。
- 用户内容逐字进 prompt（注入面） — assemblePrompt 原样拼接【用户内容】区块；本模板会把其中的数字直接映射成柱高。
风险提醒：绿色，放心使用。判级对象＝skill 目录（SKILL.md + example.md + example.html + 站点截图资产）：无可执行脚本、无凭证读取、无写盘指令；SKILL.md 正文不含任何 CDN/接口要求（字体只写字族名，唯一 URL 是 frontmatter 的 op7418/guizang-ppt-skill 出处置标，非运行时调用），反而明令「不用任何外部图片 URL」。目录内实际端点自证：example.html 的 cdn.tailwindcss.com 远程 script 与 fonts.googleapis.com @import，属产物引用。本仓 html-anything 模板按批4口径统一 🟢 绿档：判级对象＝skill 自身目录；宿主壳（loader.ts/assemblePrompt/本地 agent CLI/预览 iframe）与 example.html 里的字体、CDN 引用属产物期行为（由浏览器拉取、skill 执行时不外发），只写进 reason/risks，不判档。
5第二遍独立确认
- [ok] 文件清单（4 项，无脚本） — SKILL.md(4865B) / example.md(331B) / example.html(6131B) / docs/screenshots/skills/deck-swiss-international.png；无 .sh/.py/.js/.ts。
- [ok] 正文端点复核 — SKILL.md 内无 http URL；字体只写 Inter Tight / Inter / Noto Sans SC / JetBrains Mono 等字族名。
- [ok] 目录内端点自证 — example.html: cdn.tailwindcss.com（远程 script）+ fonts.googleapis.com（@import）；SKILL.md: frontmatter 的 github.com/op7418/guizang-ppt-skill 出处置标。
- [ok] 无凭证读取 — key/secret/token/.env 零命中。
- [ok] 无写盘指令 — SKILL.md 无 write/save 类指令；shared.ts 明令禁文件工具。
- [ok] 22 个版面清单完整 — S01 Cover → S22 Image Hero 逐条在正文；抽查 S06 KPI Tower、S08 Duo Compare、S18 Why Now 均逐字存在。
- [ok] 4 套主题 hex 逐字可复核 — #002FA7 / #FFD500 / #C5E803 / #FF6B35 与各自 paper/ink 均在正文。
- [ok] 6 条铁律逐字可复核 — 直角 border-radius:0 / 1px hairline / 16 列网格 / 字体族 / 字号反差 / 不许编造，全部命中。
6结论
适合：适合事实、产品、分析、方法论类表达：路线图、季度复盘、KPI 汇报、方法论讲解、商业/AI 主题分享。想要「一眼看上去是设计师做的」的学院派冷静感时最合适，也是本仓默认兜底模板（CLI 兜底 + README 首屏）。
不适合：不适合需要温度、手绘感、杂志编辑风的场合（该用 deck-guizang-editorial / deck-magazine-web 一类）；不适合圆角/阴影/渐变取向的品牌体系（本模板明令 border-radius: 0、禁阴影渐变）；不适合品牌色与四套主题都不符的机构交付（hex 不许改）。
安装 agent 直装可复制
① 本站镜像 更新 2026-09-15
方式 A · 人下载镜像包下载 deck-swiss-international.tar.gz
sha256:
方式 B · JSON 格式安装指南，复制给 agent6d2dc3f18adde621…agent 读 JSON 指南后会自动从本站下载安装，无需更多说明。
② 上游 GitHub · 原始来源
来源信息 GitHub 原始
作者 / 仓库nexu-io / nexu-io/html-anything
原始 GitHubnexu-io/html-anything ↗
Stars8827
最近推送2026-09-15
本 skill commit
553ed98c28许可Apache-2.0（工作副本根目录 LICENSE 文件 = Apache License Version 2.0；GitHub API spdx_id=Apache-2.0。注意：skill 目录本身不含独立 LICENSE，许可来自仓库根；第三方来源模板在 README 另有署名说明）
本站信息
收录日期2026-09-06
分类设计
侦查报告AI 侦查 · 2 遍 · 2026-09-06
本站镜像与 GitHub 原始是不同来源：本站锁定 commit 快照经 /r2 分发；GitHub 为实时上游，内容可能已更新。