メニュー
Generate a stunning magazine-quality slide deck as a self-contained HTML page. Use when creating presentations, stakeholder decks, or visual storytelling for any technical topic.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Create a pull request with conventional commits and a structured description. Supports GitHub and Azure DevOps — platform is auto-detected from the git remote. Use when the user wants to open a PR, commit changes, or submit work for review.
Create a pull request with conventional commits and a structured description. Supports GitHub and Azure DevOps — platform is auto-detected from the git remote. Use when the user wants to open a PR, commit changes, or submit work for review.
Analyze meeting transcripts — extract decisions, action items, and create SSOT documents. Use when processing standup notes, stakeholder reviews, or sprint meetings.
Save valuable insights from the current session to storage. Use when you've discovered decisions, patterns, or gotchas worth remembering across sessions.
Generate comprehensive, production-ready README.md by analyzing codebase with explorer + documenter agents. Use when creating or updating project documentation.
Sync project context to copilot-instructions.md by analyzing codebase patterns and conventions. Use after adding agents, commands, or significant architecture changes.
| name | generate-slides |
| description | Generate a stunning magazine-quality slide deck as a self-contained HTML page. Use when creating presentations, stakeholder decks, or visual storytelling for any technical topic. |
Load the visual-explainer skill, then generate a slide deck for: $@
Follow the visual-explainer skill workflow. Read the reference template at ./templates/slide-deck.html and slide patterns at ./references/slide-patterns.md before generating. Also read ./references/css-patterns.md for shared patterns (Mermaid zoom controls, depth tiers, overflow protection) and ./references/libraries.md for Mermaid theming, Chart.js, and font pairings.
Slide output is always opt-in. Only generate slides when this command is invoked or the user explicitly asks for a slide deck.
Aesthetic: Pick a distinctive direction from the 4 slide presets in slide-patterns.md (Midnight Editorial, Warm Signal, Terminal Mono, Swiss Clean) or riff on the existing 8 aesthetic directions adapted for slides. Vary from previous decks. Commit to one direction and carry it through every slide.
Narrative structure: Slides have a temporal dimension — compose a story arc, not a list of sections. Start with impact (title), build context (overview), deep dive (content, diagrams, data), resolve (summary/next steps). Plan the slide sequence and assign a composition (centered, left-heavy, split, full-bleed) to each slide before writing HTML.
Visual richness: Proactively reach for visuals. If surf CLI is available (which surf), generate images for title slide backgrounds and full-bleed slides via surf gemini --generate-image. Add SVG decorative accents, inline sparklines, mini-charts, and small Mermaid diagrams where they make the story more compelling. Visual-first, text-second.
Compositional variety: Consecutive slides must vary their spatial approach. Alternate between centered, left-heavy, right-heavy, split, edge-aligned, and full-bleed. Three centered slides in a row means push one off-axis.
Write to ~/.agent/diagrams/ and open the result in the browser.
