Slide deck

Skill vanthienha199/openclaw-skills/slide-deck

OpenClaw skills & agent plugins - cost tracker, deploy (Vercel/Netlify/Fly.io), translate, Supabase, Figma, slides, job search. Works with Claude Code, Codex, Gemini CLI.

Install

npx -y skills add vanthienha199/openclaw-skills --skill slide-deck

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Generate beautiful HTML slide presentations from markdown or plain text. Dark theme, smooth animations, speaker notes. Output is a single HTML file that opens in any browser. Use when the user asks to create slides, a presentation, a deck, or a pitch. Triggers on: "make slides", "create a presentation", "slide deck", "pitch deck", "make a PPT", "presentation for".

SKILL.md

4.9 KB, as published. Nobody here has run it

Slide Deck

You generate clean, professional HTML slide presentations from text or markdown input.

Core Behavior

When the user provides content (text, markdown, outline, or topic), generate a single self-contained HTML file that works as a slide presentation in any browser.

Output Format

A single HTML file using reveal.js CDN. The file must be:

Self-contained (no local dependencies)
Dark theme by default (professional, high contrast)
Responsive (works on any screen size)
Keyboard navigable (arrow keys, spacebar)

HTML Template

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>[TITLE]</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/theme/black.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/plugin/highlight/monokai.min.css">
    <style>
        .reveal { font-family: 'Inter', -apple-system, sans-serif; }
        .reveal h1 { font-size: 2.5em; font-weight: 700; }
        .reveal h2 { font-size: 1.8em; font-weight: 600; color: #58a6ff; }
        .reveal h3 { font-size: 1.3em; color: #8b949e; }
        .reveal li { margin-bottom: 0.5em; font-size: 0.9em; }
        .reveal code { background: #161b22; padding: 2px 8px; border-radius: 4px; font-size: 0.85em; }
        .reveal pre code { padding: 16px; font-size: 0.75em; }
        .reveal .subtitle { color: #8b949e; font-size: 0.7em; margin-top: 0.5em; }
        .reveal .highlight { color: #f0883e; font-weight: 600; }
        .reveal .stat { font-size: 3em; font-weight: 700; color: #58a6ff; }
        .reveal blockquote { border-left: 4px solid #58a6ff; padding-left: 1em; font-style: italic; color: #8b949e; }
    </style>
</head>
<body>
    <div class="reveal">
        <div class="slides">
            [SLIDES HERE]
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/reveal.js@5/plugin/highlight/highlight.min.js"></script>
    <script>
        Reveal.initialize({
            hash: true,
            transition: 'fade',
            transitionSpeed: 'fast',
            plugins: [RevealHighlight]
        });
    </script>
</body>
</html>

Slide Structure Rules

Title slide

<section>
    <h1>[Title]</h1>
    <p class="subtitle">[Subtitle or author]</p>
</section>

Content slide (bullets)

<section>
    <h2>[Heading]</h2>
    <ul>
        <li>[Point 1]</li>
        <li>[Point 2]</li>
        <li>[Point 3]</li>
    </ul>
</section>

Stat slide (for impact numbers)

<section>
    <p class="stat">43.3%</p>
    <h2>GPU sits idle during tool execution</h2>
    <p class="subtitle">Matches Kim et al.'s 30-55% finding (HPCA 2026)</p>
</section>

Code slide

<section>
    <h2>[Heading]</h2>
    <pre><code class="language-python">[code here]</code></pre>
</section>

Quote slide

<section>
    <blockquote>"[Quote text]"</blockquote>
    <p class="subtitle">— [Attribution]</p>
</section>

Design Rules

Maximum 5 bullet points per slide — if more, split into 2 slides
Maximum 15 words per bullet point
One big idea per slide
Use stat slides for impressive numbers (big font, high impact)
Use code slides only when showing actual code
Title slide + 8-15 content slides + closing slide is ideal
Add speaker notes with <aside class="notes"> when the user provides extra context

Commands

From text

User: "Make slides about [topic]"

Generate 10-12 slides covering the topic
Save as [topic]-slides.html

From markdown

User: "Turn this into slides: [markdown]"

Convert headings to slide titles
Convert bullets to slide content
Each ## heading = new slide

From outline

User: "Slides from this outline: 1. Intro 2. Problem 3. Solution 4. Results"

Each outline item = 1-2 slides
Add content based on context

Rules

Always output a SINGLE HTML file — no external dependencies except CDN
Dark theme by default. Light theme only if user requests it.
Never put more than 5 items on one slide
Never use clip art, stock photos, or emojis in slides
File saves to current directory unless user specifies a path
Name the file descriptively: agenttrace-presentation.html, not slides.html