1仕組みと動作原理
本skillは実行可能プログラムではなく、プレーンテキストのプロンプトテンプレートです。ホストが正規表現でSKILL.mdのYAML frontmatterを解析し、本文bodyをプロンプト本体としてロードします。
next/src/lib/templates/loader.ts
const { fm, body } = parseFrontmatter(raw);
リポジトリのディレクトリ規約に関する自己記述：「SKILL.md — frontmatter (id, scenario, tags, …) + prompt body」、および「Adding a template = adding a folder. No TS code change required」—テンプレートはディレクトリ規約によって登録されます。リポジトリ全体のTS/TSX内に"pricing-page"のハードコードされた参照は見当たらず、本テンプレートに対するコード上の特例処理は一切存在しません。
テンプレート本文は単独で実行されず、最終プロンプトの「テンプレート部」に組み込まれます：共有デザイン指示 + 本テンプレート本文 + ユーザーコンテンツ。
next/src/app/api/convert/route.ts
prompt = assemblePrompt({ body: skill.body, content, format });
shared.tsのassemblePromptの記述：「Wrap a per-template instruction body with the shared design directives and the user content tail.」；リクエストはまずconst skill = loadSkill(templateId);によって本ディレクトリのbodyを取得した後に組み立てられます。
グローバルの「コンテンツ駆動型の数量」ルールがテンプレート内のいかなる数値も上書きします：テンプレートはレイアウト/スタイル/配色/コンポーネントライブラリのみを定義し、出力の長さを定義しません。
next/src/lib/templates/shared.ts
数量**完全由【用户内容】的实际长度和信息结构决定**
このルールは「最優先事項であり、テンプレート内のいかなる数値も上書きする」と明記されており、deck系テンプレートにおける「6〜10枚」といった数値も「短いサンプルにおける参考下限値とみなす」と明記されています。したがって、本テンプレートが提供するのは利用可能なレイアウトと制約であり、ページ数の上限ではありません。
生成物の形式はグローバルなハード制約を受けます：単一ファイルHTML、コードフェンスなしの純粋なHTML、最初の文字は<でなければならず、ファイル書き込みは禁止されています（フロントエンドがstdoutをキャプチャ）。
next/src/lib/templates/shared.ts
不要用 markdown 代码围栏包裹, 不要任何解释性文字
同一箇所に「Write / Edit / MultiEdit / Bash / Create / いかなるファイルシステムツールの使用も禁止」と明記されています—ファイルの保存はホストのフロントエンドが担当し、テンプレート側でディスク書き込み動作は発生しません。
frontmatterのメタデータがセレクターの表示（中国語名/英語名/絵文字/説明/カテゴリ/シナリオ/アスペクト比/タグ/サンプルメタデータ）を駆動します。
next/src/lib/templates/loader.ts
zhName: fm.zh_name ?? fm.name ?? id,
本テンプレートのメタデータ：category=prototype、scenario=sales、aspect_hint=デスクトップ 1440（featuredなし、セレクターではおすすめバケットの後方に配置）。セレクターはcategory/scenarioでグループ化し、featuredでソートされますが、これらはすべてfrontmatterによって決定され、コードの特例処理はありません。
同梱のサンプルアセットは2つの読み取り専用API経由でフロントエンドに公開されます：example.htmlはそのままiframeに返され、example.mdは「プレビュー」ボタンの入力コンテンツとして機能します。
next/src/app/api/templates/[id]/preview/route.ts
verbatim so it can be loaded into an
example.htmlのレスポンスヘッダーはContent-Type: text/html; charset=utf-8です。もう一つのルートはcontent: skill.exampleMd ?? ""としてサンプルテキストをクライアントに渡します。本ディレクトリにはexample.html（7117バイト）のみが存在し、example.mdはありません。
実行チェーン（ホストの動作であり、本テンプレートのコードではありません）：ホストがローカルでログイン済みのagent CLIをspawnし、組み立てられたプロンプトをstdin経由で送り込み、stdoutからHTMLをストリーミング回収します。
next/src/lib/agents/invoke.ts
child.stdin.write(opts.prompt);
子プロセスはcwd=process.cwd()（cwd: opts.cwd ?? process.cwd(),）で実行され、stdioはすべてパイプ接続されます。プロンプトはシェルの連結ではなくstdin/--message経由で渡されます（not interpolated into a shell command）。
テンプレートの目的は「価値と価格の一目でわかる整合」です：Header / 3枚カード / 比較表 / FAQ / CTAの5段構成であり、中間プランをハイライトすることが明記されています（価格アンカリングの一般的な手法）。
next/src/lib/templates/skills/pricing-page/SKILL.md
【意图】标准 SaaS 三档定价页, 一眼对齐价值与价格。
prototype-webの「サイト全体のランディング」とは異なり、本テンプレートは価格設定ページという1つのコンバージョンページのみを対象とし、範囲を狭めつつ深度を深めています（比較表とFAQを含む）。
FAQにはネイティブの<details>/<summary>の利用が指定されており、JSなしで折りたたみインタラクションが動作するため、生成物の堅牢性が向上します（スクリーンショット/静的ホスティング/スクリプト無効環境でも利用可能）。
next/src/lib/templates/skills/pricing-page/SKILL.md
- FAQ (details/summary)
共有指示では生成物が直接開ける単一ファイルであることが要求されており、ネイティブの折りたたみコントロールは「プログレッシブエンハンスメント」の要件に合致しています。
2コア機能
01請求サイクル切り替えスロット（月払い/年払い）
023段階プライシングカード + 中間プランの「人気」ハイライト
03完全な機能比較表（「プラン別チェックマーク」の次元を含む）
04ネイティブなdetails/summaryによる折りたたみFAQ
05下部コンバージョンCTA
3外部依存関係
| Kind | Dependency / Endpoint |
|---|---|
| network | Tailwind Play CDN（共享指令对产物的要求） |
| network | jsdelivr CDN（可选：图表/动画脚本） |
| network | Google Fonts（共享指令指定） |
| cli | 本机 coding-agent CLI（宿主检测 PATH 并 spawn） |
4推奨統制措置と判定根拠
安全運用のための推奨統制措置
Agent 向け
アクセス可能ドメインとキー範囲を宣言
管理者向け
最小権限のキー、リクエストログを保持
判定根拠（ファイルパスと抜粋）
- 网络端点: 外部ネットワークアクセスの宣言：生成物側（共有デザイン指示による要件）：生成されたHTMLはブラウザ内でcdn.tailwindcss.com（Tailwind Play）およびGoogle Fontsを読み込みます。
監査ノート： 判定基準：本skillディレクトリ（SKILL.md + example.html）のみを評価対象とし、ホストシェルおよび生成物の外部リンクは判定対象外とします。ディレクトリ内にはスクリプト、ネットワークエンドポイント、認証情報の読み取り、ディスク書き込み指示は一切存在しません。ディレクトリ全体のトークンスキャンでのヒットはゼロであり、SKILL.mdにはランタイムで読み込むべきCDN/フォント/APIの指定はありません。評価を変更しない補足事項2点：① ホストシェル（loader.ts → assemblePrompt → agents/invoke.tsによるローカルCLIのspawn；--permission-mode bypassPermissionsを含むclaude引数、{...process.env}による環境変数の全量透過）はホスト側の挙動であり、verdict.risksに記載済みです。② ホストから注入される共有デザイン指示により、生成物の<head>内でTailwind Play / Google Fontsの読み込みが要求されます（生成物の実行時外部リンクに該当）。
5二重目の独立検証
- [ok] skill 目录资产面（脚本 / references / 数据 / 模板） — 目录实为 2 个文件：SKILL.md 与 example.html；无 scripts/、无 references 目录、无任何可执行文件（.sh/.py/.js/.mjs/.ts 零命中）。
- [ok] 「无脚本、无网络、无凭证、无写盘」的反例搜索 — 对目录递归 token 扫描（api[_-]?key|token|secret|\.env|process\.env|child_process|fetch\(|curl |wget |npm |npx |exec\(|subprocess|writeFile|fs\.）：零命中；SKILL.md 另按 http|CDN|cdn|font|API|api|fetch|Google|script 扫描，仅命中 font-semibold / font-black 这类字重类名，无端点。
- [ok] 官方描述 vs 实际能力（有无夸大） — frontmatter description（三档定价 + 特性对比表 + FAQ）与正文一致：描述承诺的版式要素都能在正文找到对应条目，未见正文未支持的越界承诺。
- [ok] 外部资源/工具条目逐条回源 — external_deps 中的仓库级条目（Tailwind Play CDN / jsdelivr / Google Fonts / 本机 agent CLI）逐条回到 shared.ts 与 argv.ts 原文取证；本模板无目录级端点条目。
- [ok] 宿主执行链（供 security.reason / verdict.risks 使用，不参与判级） — prompt 经 stdin 送入被 spawn 的本机 CLI（invoke.ts），HTML 从 stdout 分流捕获；claude 参数含 --permission-mode bypassPermissions、envFor 透传 process.env；预览 iframe sandbox="allow-scripts allow-same-origin"（template-picker.tsx:544 / preview-pane.tsx:297）。
- [ok] 路径与 commit 一致性 — 工作副本 /var/ytdown/skills-portal/spy-repos/html-anything 的 git HEAD = 553ed98c283f9c0f489902d035416a972d6a9699（与任务表 pin 一致）；skill.path=next/src/lib/templates/skills/pricing-page 下确有 SKILL.md，全仓无第二份同名模板。
- [ok] 页面里的"切换"是否需要 JS 或接口 — SKILL.md 只要求版面存在切换位（"- Header + monthly/annual 切换"），未要求接计价接口或写切换逻辑；目录内无脚本、无端点，产物可为纯 CSS/静态交互。
- [ok] 随包 example.html 的外链与脚本面 — pricing-page/example.html（7117 字节）无 http(s) 外链、无 <script>：卡片/对比表/FAQ 全部内联 CSS 实现。
6結論
最適な用途： SaaSプライシングページのデザインカンプ/LPプロトタイプに最適：3つのパッケージプラン、プラン別比較表、疑問を解消するFAQ、下部コンバージョンCTAがワンセットで揃っています。
不向きな用途： 非SaaS型のビジネスモデルには不向き（一括買い切り/従量課金/複数通貨・税率表示などの複雑な価格設定は仕様外）；オンライン決済APIの連携や実際の決済処理を必要とする開発要件には不向き（テンプレートは静的ページのみを出力）。
Install Agent-Ready
① Verified Mirror 2026-09-15
Option A · Direct DownloadDownload pricing-page.tar.gz
sha256:
Option B · Copy Guide for Agent5bfaf951bbc55604…Agent はこの JSON ガイドから自動的にダウンロードして検証します。
② Upstream GitHub
GitHub Repo ↗
Pinned to commit 553ed98c28.