デザイン&モーション · nexu-io/html-anything

deck-replit

Replit Slides 8種テーマ (helix/holm/vance/bevel/world/atlas/bluehouse)

L3 ネットワーク · ドメインとキー範囲を宣言V1 コミット固定ネットワーク通信Dual-pass Audit
Author nexu-ioGitHub nexu-io/html-anything ↗Stars 8827License Apache-2.0(工作副本根目录 LICENSE 文件 = Apache License Version 2.0;GitHub API spdx_id=Apache-2.0。注意:skill 目录本身不含独立 LICENSE,许可来自仓库根;第三方来源模板在 README 另有署名说明)Commit 553ed98c28
管理レベルは Skill の能力と推奨統制措置を示すものであり、品質や安全性の認証、利用可否の判定ではありません。使用の可否はユーザーおよび管理者が決定します。Agent 環境によって制約が異なるため、自動保護を仮定しないでください。第三者製 Skill の著作権は原著作者に帰属し、利用リスクは利用者が負います。

1仕組みと動作原理

本スキルは html-anything の「テンプレートパック」です。セレクターがメタデータを取得するための frontmatter と、ローダーによってそのままモデル指示として読み出される SKILL.md 本文(frontmatter 以降の body)で構成されます。

next/src/lib/templates/loader.ts
const { fm, body } = parseFrontmatter(raw);
本テンプレート本文は約 15 行 / 1074 バイト(意図 + テーマ一覧 + スライド数ルール)。frontmatter は parseFrontmatter により fm と body に分割され、ディレクトリ内のスクリプト関与は一切ありません。

実際にモデルへ渡されるプロンプト = 共通デザイン指示 + 本テンプレート本文 + 【入力形式】 + 【ユーザーコンテンツ】。共通指示には、テンプレート内のスライド数/レイアウト数値が上限ではないことを明記したオーバーライド規則も含まれます。

next/src/lib/templates/shared.ts
return `${SHARED_DESIGN_DIRECTIVES} ${opts.body.trim()}
同ファイル内で続くオーバーライド規則には、「テンプレートは『使用可能なレイアウト / スタイル / 配色 / フォント / コンポーネントライブラリ』を定義するのみであり、スライド / フレーム / カード / セクションの数を**定義しない**」と逐語的に記述されています。

出力規律は共通指示によって厳格に制約されます。エージェントによるファイルシステムツールの使用は禁止されており、HTML は必ず stdout テキストとしてストリーミング出力され、フロントエンド側でディスクへ保存されます。

next/src/lib/templates/shared.ts
- **禁止使用 Write / Edit / MultiEdit / Bash / Create / 任何文件系统工具**。不要把 HTML 写到任何
本テンプレート自体は保存方法を宣言せず、完全にこの共通制約に依存しています。

テーマ機構は「8種から1つを選択し混用しない」仕様です:helix / holm / vance / bevel / world-dark / world-mint / atlas / bluehouse。各テーマに完全なカラーパレット、フォント、アクセントが完備されています。

next/src/lib/templates/skills/deck-replit/SKILL.md
- Pick one theme: helix / holm / vance / bevel / world-dark / world-mint / atlas / bluehouse
deck-presenter-mode のランタイムでのテーマ切り替えとは対照的で、ここでは生成前にテーマが確定され、全体を通して維持されます。

スライド数はコンテンツ長さに明示的に委ねられます:表紙 + アジェンダ + N件のコンテンツ + 結び。短いコンテンツで6〜10枚から始まり、長いコンテンツではさらに増加します。

next/src/lib/templates/skills/deck-replit/SKILL.md
- Cover + agenda + N 个 content + 收尾 (N 由【用户内容】长度决定, 完整覆盖每个要点; 短内容 6-10 起步, 长内容应更多)
今回のバッチの9テンプレートの中で、「数量の自律決定」が最も率直に明記されている例です。

付属の example.md はテンプレートの下書きではなく「入力サンプル」です。テーマ(world-mint)、スライドタイトル、5項目のアジェンダを提供し、短い入力から2ページプレビューへの変換例を示しています。

next/src/lib/templates/skills/deck-replit/example.md
## Agenda
同ファイル内の「Replit Slides 八套主题之一 (helix / holm / vance / bevel / **world-mint** / atlas / bluehouse)」という記述は、本文のテーマ一覧と整合しています。

出典が完全に明記されています:frontmatter に example_source_url = replit.com/slides と記録され、さらに example_id/example_name/example_format など6項目が存在します。

next/src/lib/templates/skills/deck-replit/SKILL.md
example_source_url: "https://replit.com/slides"
この URL は出典表示のためだけのものであり、リクエストを発生させることはありません。

2コア機能

018種のテーマから1つを選択(helix/holm/vance/bevel/world-dark/world-mint/atlas/bluehouse)、混用不可
02スライド数はコンテンツの長さに依存:表紙 + アジェンダ + N件のコンテンツ + 結び(短い場合は6〜10枚から、長いコンテンツはそれ以上)
03horizontal-swipe 単一ファイルスライド形式(横方向のスワイプ・ページ遷移)
04各テーマに完全なカラーパレット + フォント + アクセントが紐づけられ、テーマ内の統一性を担保
05入力サンプル(example.md)を同梱:world テーマ + スライドタイトル + 5件のアジェンダ
06CLI キーワードルーティング:replit / terminal / 终端 / 暗色 → deck-replit
07replit.com/slides への出典明記が可能(frontmatter の example_source_url)

3外部依存関係

KindDependency / Endpoint
cli宿主本机 agent CLI(应用侧 spawn;非本 skill 指令)
networkTailwind CDN(产物示例引用,非 skill 正文要求)
networkGoogle Fonts(产物示例引用)
network出处置标(frontmatter 元数据,非调用)

4推奨統制措置と判定根拠

安全運用のための推奨統制措置
Agent 向け
アクセス可能ドメインとキー範囲を宣言
管理者向け
最小権限のキー、リクエストログを保持
判定根拠(ファイルパスと抜粋)
  • 网络端点: 外部ネットワークアクセスの宣言:example.html に <script src="https://cdn.tailwindcss.com"> および Google Fonts への参照が含まれています
監査ノート: 評価対象=skill ディレクトリ(SKILL.md + example.md + example.html):実行可能スクリプトなし、認証情報読み取りなし、ディスク書き込み指示なし。SKILL.md 本文には CDN/API の要求が一切ありません(唯一の URL は frontmatter にある出典表示用の replit.com/slides であり、ランタイム呼び出しではありません)。ディレクトリ内の実エンドポイントの自己証明:example.html には cdn.tailwindcss.com からのリモートスクリプトと fonts.googleapis.com の @import が含まれますが、成果物側の参照に該当します。当リポジトリの html-anything テンプレートは第4バッチ基準に従い、一律で 🟢 緑判定 とします。評価対象=skill 自身のディレクトリであり、ホストシェル(loader.ts/assemblePrompt/ローカルエージェント CLI/プレビュー iframe)や example.html 内のフォント・CDN 参照は成果物フェーズの挙動(ブラウザ側で取得され、skill 実行時には外部送信されない)であるため、reason/risks に記載するのみで格付け判定には影響しません。

5二重目の独立検証

  • [ok] 文件清单(3 个文件,无脚本) — SKILL.md(1074B) + example.md(380B) + example.html(5051B)。
  • [ok] 正文端点复核(仅元数据 URL) — SKILL.md 第 13 行 example_source_url = https://replit.com/slides(出处置标);正文无 CDN/接口要求。
  • [ok] 目录内端点自证 — example.html: cdn.tailwindcss.com(远程 script)+ fonts.googleapis.com(@import)。
  • [ok] 无凭证读取 — key/secret/token/.env 零命中。
  • [ok] 无写盘指令 — SKILL.md 无 write/save 类指令;shared.ts 明令禁文件工具。
  • [ok] 8 套主题清单逐字可复核 — helix / holm / vance / bevel / world-dark / world-mint / atlas / bluehouse 全在正文与 example.md。
  • [ok] 页数自决规则逐字可复核 — 「短内容 6-10 起步, 长内容应更多」原句存在。
  • [ok] official_desc 逐字命中 — 与第 6 行 description 引号内文本一致。

6結論

  • 一貫性優先:8種のテーマから1つを選択して混用しない設計により、同一スライド内での視覚言語の混在を防止。
  • 最も誠実なスライド数ルール:下限を明示しつつ上限を設けない仕様で、共通指示のオーバーライド規則と同一方針。
  • アセットのペアリング(入力サンプル + 成果物プレビュー)により、ユーザーおよびモデルが事前に確認して選択可能。
  • 透明な出典管理:frontmatter と README の双方に replit.com/slides の出典を記録。
  • 最適な用途: Replit Slides のような開発者スタイルの横スワイプスライドを用いて、製品レビューや社内技術メモを作成したい用途に適しています。8種類のテーマにより、「ダークな開発者感」の中でスタイルを選び分ける余地があります。
    不向きな用途: 正確なブランドカラー値が求められる法人納品案件(テーマは hex 値を固定しません)、厳格なスライド数管理が必要な場面(本文で上限なしと明記)、プレゼンター主導の口頭発表(発表者ノート機能がないため deck-presenter-mode を推奨)には不向きです。
    Install Agent-Ready
    ① Verified Mirror 2026-09-15
    Option A · Direct DownloadDownload deck-replit.tar.gz
    sha256: 7370702e0d48661d…
    Option B · Copy Guide for Agent
    install.json
    Agent はこの JSON ガイドから自動的にダウンロードして検証します。
    ② Upstream GitHub
    GitHub Repo ↗
    Pinned to commit 553ed98c28.