메뉴
Build a presentation as one self-contained, zero-dependency HTML file (16:9, keyboard + touch nav), authored directly by the agent. Use when creating slides, a deck, or a talk from notes or a document.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Write standalone single-file Python scripts using PEP 723 inline metadata and uv. Use when creating a quick CLI script that needs dependencies without a full project.
Canonical Python development stack — uv, Ruff, ty, pytest, scaffolding, Litestar web, Typer scripts, and AI agents via agents-cli. Use for any Python project, library, CLI, or agent.
Cut a versioned release for fmind/dotfiles using the Go dot CLI release command (alias r). Use when shipping a new tagged version of dotfiles.
Configure MCP servers for Antigravity, OpenCode, and Claude — stdio or remote transport, workspace or user scope. Use when adding, connecting, or troubleshooting an MCP server.
Bootstrap workspace agent configuration — AGENTS.md, the .agents/ layout, subagents, and skills — for Antigravity, OpenCode, and Claude. Use when initializing or onboarding a repository for agents.
Install Agent Skills with the `skills` CLI — from a Git repo or local path, into workspace or global scope for Antigravity, OpenCode, and Claude. Use when adding or updating skills.
| name | html-slides |
| description | Build a presentation as one self-contained, zero-dependency HTML file (16:9, keyboard + touch nav), authored directly by the agent. Use when creating slides, a deck, or a talk from notes or a document. |
| metadata | {"author":"Médéric HURIER (Fmind)","source":"github.com/fmind/dotfiles/tree/main/skills/html-slides","created":"2026-07-07T00:00:00.000Z","updated":"2026-07-07T00:00:00.000Z"} |
Produce a presentation as a single, self-contained .html file — inline CSS/JS, no npm, no build, no CDN. It opens in any browser, works offline, and deep-links per slide. A coding agent writes HTML fluently, so it authors the deck directly — full design control, zero dependencies. Dependencies are debt; a single HTML file still works in 10 years.
deck.html and edit the --theme tokens (--bg, --fg, --accent, --font) plus <title>. Pick a distinctive palette — avoid the generic look; the tokens re-skin the whole deck.<section class="slide"> per idea inside the fixed 1280×720 canvas. Use the built-in .center, .cols, .kicker, .fragment helpers. Keep ~one message per slide; let whitespace breathe.Every slide is a 1280×720 px canvas; the stage scales to fit the window (letterboxed) via JS, so layout is pixel-predictable. Design to that fixed size — do not use viewport units for layout. Slide-authoring conventions:
h1 64 / h2 44 / body 28). Trust it; resist shrinking text to cram content — split the slide instead.class="fragment" to any element to reveal it step-by-step on →/Space before the deck advances.<pre><code> (monospace token preset). Paste real, minimal snippets — no live highlighting runtime by design.data: URIs to keep the file self-contained. For large images, weigh the trade-off against portability.F fullscreen.deck.html#4.