Name: deck-open-slide-canvas
Author: nexu-io

About

Imported from nexu-io/html-anything (next/src/lib/templates/skills/deck-open-slide-canvas/SKILL.md). Install upstream with npx skills add nexu-io/html-anything --skill deck-open-slide-canvas. Copyright stays with the author.

【模板: 1920 画布自由 Deck】【意图】不想被模板束缚的场景 (个人作品集、奇特演讲、艺术 / 设计课 deck)。给一个固定 1920×1080 画布 + 极强的类型 / 调色约束, 让 agent 像写 React 组件一样按内容自由排布每一页。Inspired by 1weiho/open-slide。

【硬性技术规格】

画布: 每页严格 width: 1920px; height: 1080px; 用 transform: scale(...) 适配视窗 (默认 scale(0.7) 居中)。
绝对禁止 overflow: 每页内容必须 fit in 1920×1080, 不许滚动条出现。
字号 type scale (px): 2xs:18 · xs:22 · sm:28 · md:36 · lg:48 · xl:64 · 2xl:88 · 3xl:120 · 4xl:160 · 5xl:220。
边距 padding: 96 / 128 / 160 三档之一。
每页有 <section class="slide" data-slide-id="<n>">。

【调色板 — 每个 deck 选 1 套, 全程不改】

🌫 Ash & Lime — bg #f1efea, ink #161616, accent #c5e803。
🌌 Sea Indigo — bg #0a0e1a, ink #f5f5f7, accent #5ac8fa。
🧉 Mate Mocha — bg #1a1411, ink #f5e9d6, accent #d97757。
🌸 Pearl Rose — bg #fdf6f3, ink #1a1015, accent #ff5d8f。

【布局自由度 — 这是核心】

不强制模板, 每页根据内容性质自选布局: cover / question / quote / image-text / 三列 / 五列 / 列表 / 数据卡 / 满版图。
但每页必须遵守一条规则: 视觉重心 (visual hierarchy) 只有 1 个 — 一句金句、一个数字、一张图, 不要"什么都强调"。
不许塞两段平等的文字; 真要并列就上 3 列等权重网格。

【字体】

西文: Inter Tight (display) + Inter (body); 或 Source Serif Pro (editorial 风时)。
中文: Noto Sans SC (sans 风) 或 Noto Serif SC (editorial 风); 不混 sans + serif。
mono: JetBrains Mono 给数据 / 时间戳。

【设计细节】

严禁 emoji 装饰 (内容里的允许); 严禁多色彩虹; accent 只用一个色。
严禁 SVG icon 套用 lucide / feather 等通用库 (自己写 inline SVG)。
加键盘 ← / → 切换 + hash 同步; 角标固定: 右下 №N/M, 左下 deck title。
必须用用户的真实内容; 严禁 lorem ipsum。
单文件 HTML; Tailwind CDN; 不要外链图片。

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml

targets:
  - https://api.opensmartroute.ai/api/v1/registry/nexu-io-html-anything-deck-open-slide-canvas/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

nexu-io-html-anything-deck-open-slide-canvas.ocm.jsonjson

{
  "ocm": "1",
  "id": "nexu-io-html-anything-deck-open-slide-canvas",
  "kind": "skill",
  "name": "deck-open-slide-canvas",
  "description": "锁死 1920×1080 画布, React 组件级自由组合, 不绑模板",
  "publisher": "nexu-io",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "math"
    ],
    "tags": [
      "skill-md",
      "canvas",
      "open-slide",
      "freeform",
      "1920",
      "react",
      "github"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "锁死 1920×1080 画布, React 组件级自由组合, 不绑模板"
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "github",
      "repository": "https://github.com/nexu-io/html-anything",
      "path": "next/src/lib/templates/skills/deck-open-slide-canvas/SKILL.md",
      "ref": "c31204544230578ac814026fecc153c6e36587ae",
      "url": "https://github.com/nexu-io/html-anything/blob/c31204544230578ac814026fecc153c6e36587ae/next/src/lib/templates/skills/deck-open-slide-canvas/SKILL.md",
      "key": "nexu-io/html-anything/next/src/lib/templates/skills/deck-open-slide-canvas/SKILL.md"
    }
  },
  "instructions": "【模板: 1920 画布自由 Deck】\n【意图】不想被模板束缚的场景 (个人作品集、奇特演讲、艺术 / 设计课 deck)。给一个固定 1920×1080 画布 + 极强的类型 / 调色约束, 让 agent 像写 React 组件一样按内容自由排布每一页。Inspired by 1weiho/open-slide。\n\n【硬性技术规格】\n- 画布: 每页严格 `width: 1920px; height: 1080px;` 用 `transform: scale(...)` 适配视窗 (默认 `scale(0.7)` 居中)。\n- **绝对禁止 overflow**: 每页内容必须 fit in 1920×1080, 不许滚动条出现。\n- 字号 type scale (px): `2xs:18 · xs:22 · sm:28 · md:36 · lg:48 · xl:64 · 2xl:88 · 3xl:120 · 4xl:160 · 5xl:220`。\n- 边距 padding: 96 / 128 / 160 三档之一。\n- 每页有 `<section class=\"slide\" data-slide-id=\"<n>\">`。\n\n【调色板 — 每个 deck 选 1 套, 全程不改】\n- 🌫 **Ash & Lime** — bg `#f1efea`, ink `#161616`,",
  "cost": {
    "context_tokens": 370
  }
}

Fetch it by URL: GET /api/v1/registry/nexu-io-html-anything-deck-open-slide-canvas/manifest?version=1.0.0

Reviews

Star ratings from people who tried it. One review per account; edit yours any time.

No reviews yet. Install it, try it, and be the first to rate it.