Agent skill

Presentation Generator

by glebis in glebis/claude-skills

Generate interactive HTML presentations with neobrutalism styling, ASCII art decorations, and Agency brand colors.

MITAuto-check passedDocuments & Office

Install Presentation Generator

skills CLI
$ npx skills add glebis/claude-skills --skill presentation-generator -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install glebis/claude-skills presentation-generator --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/glebis/claude-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/presentation-generator .claude/skills/presentation-generator && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
presentation-generator
GitHub stars
388
Used in
1 other repo
Token cost
~1.5k tokens
SKILL.md length
360 words
Files
6 (incl. scripts)
Skills in repo
91
Repo updated
First seen
Licence
MIT

At a glance

Generate interactive HTML presentations with neobrutalism styling, ASCII art decorations, and Agency brand colors.

  • Works in 11 steps: Create presentation from JSON/YAML content → Export to PNG slides → Export to PDF → …
  • Creating presentations
  • SKILL.md covers Overview, Quick Start, Brand Integration and Slide Types, plus 7 more sections
  • Runs JavaScript scripts from its folder; calls node and npm

What it does

Presentation Generator is an agent skill from glebis/claude-skills. Generate interactive HTML presentations with neobrutalism styling, ASCII art decorations, and Agency brand colors. Outputs HTML (interactive with navigation), PNG (individual slides via Playwright), and PDF. References brand-agency skill for colors and typography. Use when creating presentations, slide decks, pitch materials, or visual summaries.

Its SKILL.md is about 1.5k tokens, which your agent loads only when the skill is triggered. The skill folder holds 8 other files, including scripts (for example `.claude-plugin/plugin.json`, `scripts/export-slides.js` and `scripts/generate-presentation.js`).

It sits in Documents & Office, covering Slides and decks. It works with Playwright. The repository describes itself as: Collection of Claude Code skills for enhanced AI workflows. The licence is MIT.

When your agent uses it

  • Creating presentations
  • Pitch materials
  • Visual summaries

Example prompts

  • “/presentation-generator”

Requirements

  • Node.js

Workflow steps

11 steps, taken from the step headings in SKILL.md.

  1. Create presentation from JSON/YAML content
  2. Export to PNG slides
  3. Export to PDF
  4. Title Slide (--title)
  5. Content Slide (--content)
  6. Two-Column Slide (--two-col)
  7. Code Slide (--code)
  8. Stats Slide (--stats)
  9. Task Grid Slide (--grid)
  10. ASCII Art Slide (--ascii)
  11. Image Slide (--image)

What it can do on your machine

Read from SKILL.md and the folder at commit 7524dff. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 2 files in scripts/ (JavaScript), which the agent can run.

    Shell commands in SKILL.md call:

    • node
    • npm

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md. Its commands use npm, which can reach the network depending on how they are called.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Presentation Generator loads about 1.5k tokens when it runs. Until then it costs about 93 tokens; SKILL.md has 360 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~93
When it runs · the whole SKILL.md, loaded when a task matches
~1.5k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from glebis/claude-skills at commit 7524dff, republished under its MIT licence (© glebis). 360 words, ~1,519 tokens.

Download SKILL.mdSave it as .claude/skills/presentation-generator/SKILL.md (or your agent's skills folder). This skill also uses 5 other files; get the full folder from GitHub.
name
presentation-generator
description
Generate interactive HTML presentations with neobrutalism styling, ASCII art decorations, and Agency brand colors. Outputs HTML (interactive with navigation), PNG (individual slides via Playwright), and PDF. References brand-agency skill for colors and typography. Use when creating presentations, slide decks, pitch materials, or visual summaries.

Presentation Generator

Overview

Create stunning presentations in neobrutalism style with Agency brand colors. Generate interactive HTML presentations with smooth scrolling navigation, export individual slides as PNG, or create PDF documents.

Output formats:

  • HTML - Interactive presentation with navigation dots, keyboard support, smooth scrolling
  • PNG - Individual slide images via Playwright (1920x1080)
  • PDF - Multi-page document via Playwright

Quick Start

1. Create presentation from JSON/YAML content
bash
node scripts/generate-presentation.js --input content.json --output presentation.html
2. Export to PNG slides
bash
node scripts/export-slides.js presentation.html --format png --output ./slides/
3. Export to PDF
bash
node scripts/export-slides.js presentation.html --format pdf --output presentation.pdf

Brand Integration

This skill references brand-agency for consistent styling:

Colors (from brand-agency)
ColorHexUsage
Primary (Orange)#e85d04Title slides, CTAs, accents
Secondary (Yellow)#ffd60aHighlights, accent slides
Accent (Blue)#3a86ffInfo slides, links
Success (Green)#38b000Positive content
Error (Red)#d62828Warnings, emphasis
Foreground#000000Text, borders
Background#ffffffLight slides
Typography
  • Headings: Geist ExtraBold (800)
  • Body: EB Garamond
  • Code/ASCII: Geist Mono

Slide Types

1. Title Slide (--title)

Full-screen title with subtitle, colored background (primary/secondary/accent/dark).

2. Content Slide (--content)

Heading + body text + optional bullet list.

3. Two-Column Slide (--two-col)

Split layout for comparisons, text + image, before/after.

4. Code Slide (--code)

Dark background, syntax-highlighted code block with title.

5. Stats Slide (--stats)

Big numbers with labels (e.g., "14 templates | 4 formats | 1 skill").

6. Task Grid Slide (--grid)

Grid of cards with numbers, titles, descriptions.

7. ASCII Art Slide (--ascii)

Decorative slide with ASCII box-drawing characters.

Show full SKILL.md (143 more words)Show less
8. Image Slide (--image)

Full-bleed or contained image with optional caption.

ASCII Decorations

Use ASCII box-drawing characters for tech aesthetic:

Frames:   ┌─────┐  ╔═════╗  ┏━━━━━┓
          │     │  ║     ║  ┃     ┃
          └─────┘  ╚═════╝  ┗━━━━━┛

Lines:    ─ │ ═ ║ ━ ┃ ━━━ ───

Arrows:   → ← ↑ ↓ ▶ ◀ ▲ ▼

Shapes:   ● ○ ■ □ ▲ △ ★ ☆ ◆ ◇

Blocks:   █ ▓ ▒ ░

Content Format

JSON format:
json
{
  "title": "Presentation Title",
  "footer": "Company / Date",
  "slides": [
    {
      "type": "title",
      "bg": "primary",
      "title": "Main Title",
      "subtitle": "Subtitle text"
    },
    {
      "type": "content",
      "title": "Section Title",
      "body": "Introduction paragraph",
      "bullets": ["Point 1", "Point 2", "Point 3"]
    },
    {
      "type": "code",
      "title": "Code Example",
      "language": "javascript",
      "code": "const x = 42;"
    },
    {
      "type": "stats",
      "items": [
        {"value": "14", "label": "templates"},
        {"value": "4", "label": "formats"},
        {"value": "∞", "label": "possibilities"}
      ]
    }
  ]
}
YAML format:
yaml
title: Presentation Title
footer: Company / Date
slides:
  - type: title
    bg: primary
    title: Main Title
    subtitle: Subtitle text

  - type: content
    title: Section Title
    body: Introduction paragraph
    bullets:
      - Point 1
      - Point 2

Interactive Features

Generated HTML includes:

  • Navigation dots - Fixed right sidebar with clickable dots
  • Keyboard navigation - Arrow keys, Page Up/Down, Home/End
  • Smooth scrolling - CSS scroll-snap and smooth behavior
  • Intersection Observer - Active slide highlighting
  • Responsive - Works on various screen sizes (optimized for 16:9)

Usage Examples

Create workshop summary:
bash
# Generate from today's session
node scripts/generate-presentation.js \
  --title "Claude Code Lab — Day Summary" \
  --footer "29.11.2025" \
  --slides slides-content.json \
  --output workshop-summary.html
Quick presentation from markdown:
bash
# Convert markdown outline to presentation
node scripts/md-to-slides.js notes.md --output presentation.html
Batch export:
bash
# Export all slides as PNGs
node scripts/export-slides.js presentation.html --format png --output ./export/

# Result: slide-01.png, slide-02.png, etc.

File Structure

presentation-generator/
├── SKILL.md              # This file
├── templates/
│   ├── base.html         # Base HTML template
│   ├── slides/           # Slide type partials
│   │   ├── title.html
│   │   ├── content.html
│   │   ├── code.html
│   │   ├── stats.html
│   │   ├── two-col.html
│   │   ├── grid.html
│   │   └── ascii.html
│   └── styles.css        # Neobrutalism styles
├── scripts/
│   ├── generate-presentation.js  # Main generator
│   ├── export-slides.js          # PNG/PDF export
│   └── md-to-slides.js           # Markdown converter
└── output/               # Generated files

Dependencies

  • Node.js 18+
  • Playwright (npm install playwright)

Tips

  1. Use ASCII sparingly - Great for tech/dev presentations, can feel dated otherwise
  2. Stick to brand colors - Don't mix custom colors, use the 5-color palette
  3. Big text on title slides - h1 should be 4-5rem minimum
  4. One idea per slide - Neobrutalism works best with focused content
  5. Test interactivity - Always preview HTML before exporting

© glebis, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 5 other files (scripts) in presentation-generator of glebis/claude-skills.

  • SKILL.md
  • .claude-plugin/plugin.json
  • scripts/export-slides.js
  • scripts/generate-presentation.js
  • templates/base.html
  • templates/styles.css

Open the folder on GitHubat commit 7524dff

Used in 1 other repository

We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in glebis/claude-skills, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Presentation Generator next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Presentation Generator compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Presentation Generator this skillglebis/claude-skills3881 repos~1.5kAutomated safety check: PassMIT
Wowerpoint Slide Decksthedotmack/claude-mem97k—~2.2kAutomated safety check: PassApache-2.0
Fetch Slidespamelafox/presentation-skills125—~528Automated safety check: PassMIT
Obsidian Canvas ExportAgriciDaniel/claude-canvas299—~1.2kAutomated safety check: PassMIT
Create Chatgpt Video Adcriptogus/agent-evolve-network288—~5kAutomated safety check: PassCustom licence
Image To Editable Pptningzimu/image-to-editable-ppt-skill2.8k—~4.3kAutomated safety check: PassMIT

Similar skills

  • Wowerpoint Slide Decks

    thedotmack/claude-mem

    Renders a single source document as a narrative slide-deck PDF through NotebookLM, saved beside the original file for sharing.

    97k GitHub stars~2.2k tokensUpdated today
    Documents & OfficeAuto-check passed
  • Fetch Slides

    pamelafox/presentation-skills

    Fetch presentation slides from a URL and convert them to PDF.

    125 GitHub stars~528 tokensUpdated 1 mo ago
    Documents & OfficeAuto-check passed
  • Obsidian Canvas Export

    AgriciDaniel/claude-canvas

    Exports Obsidian Canvas files to PNG, SVG or PDF, using the Advanced Canvas plugin when Obsidian is open and falling back to a Playwright screenshot.

    299 GitHub stars~1.2k tokensUpdated 6 mo ago
    Documents & OfficeAuto-check passed
  • Create Chatgpt Video Ad

    criptogus/agent-evolve-network

    Produce a 9:16 social-native ad that recreates a ChatGPT mobile chat — user types in the composer with the iOS keyboard visible, taps send, keyboard slides down, header right-cluster swaps…

    288 GitHub stars~5k tokensUpdated 27 days ago
    Testing & QAAuto-check passed
  • Image To Editable Ppt

    ningzimu/image-to-editable-ppt-skill

    Rebuild slide images, scanned or image-based PPT/PPTX files, and PDF decks into object-level editable PowerPoint (.pptx), preserving speaker notes when supplied.

    2.8k GitHub stars~4.3k tokensUpdated 21 days ago
    Documents & OfficeAuto-check passed
  • Slides

    fcakyon/claude-codex-settings

    Create and edit presentation slide decks (.pptx) with PptxGenJS, bundled layout helpers, and render/validation utilities.

    1.2k GitHub starsUsed in 1 repo~1.1k tokens
    Documents & OfficeAuto-check passed

More from glebis/claude-skills

All 91 skills in this repo
  • Runs a human-first workflow for labeling PII spans in a transcript, then scores inter-annotator agreement and drafts an adjudicated gold set.

    388 GitHub stars~1.3k tokensUpdated 11 days ago
    Auto-check passed
  • Automates a dedicated, logged-in Chrome instance per profile without ever closing the user's own open tabs or browser windows.

    388 GitHub stars~973 tokensUpdated 11 days ago
    Auto-check passed
  • Deep Research

    glebis/claude-skills

    This skill should be used when conducting comprehensive research on any topic using the OpenAI Deep Research API.

    388 GitHub stars~2.6k tokensUpdated 11 days ago
    Auto-check: notes
  • Elimination Research

    glebis/claude-skills

    This skill should be used for elimination-style research where the user wants to choose from a shortlist of products, tools, services, vendors, or other options using explicit criteria, numeric…

    388 GitHub stars~1.6k tokensUpdated 11 days ago
    Auto-check passed
  • Narrated HTML Presentations

    glebis/claude-skills

    Generates a self-contained HTML presentation with article and slides modes, ElevenLabs voiceover narration and optional GPT Image 2 illustrations.

    388 GitHub stars~2.3k tokensUpdated 11 days ago
    Auto-check: notes
  • Writes fictional but realistic coaching or therapy session transcripts for evals, demos and few-shot examples, in several modalities and export formats.

    388 GitHub stars~2.9k tokensUpdated 11 days ago
    Auto-check passed

Works with

Questions about Presentation Generator

What does Presentation Generator do?

Generate interactive HTML presentations with neobrutalism styling, ASCII art decorations, and Agency brand colors. Presentation Generator is an agent skill from glebis/claude-skills. Generate interactive HTML presentations with neobrutalism styling, ASCII art decorations, and Agency brand colors.

When should I use Presentation Generator?

Presentation Generator fits situations like: creating presentations; pitch materials; visual summaries.

How do I install Presentation Generator in Claude Code?

Run `npx skills add glebis/claude-skills --skill presentation-generator -a claude-code`. Or copy the skill folder (presentation-generator in glebis/claude-skills) into .claude/skills/presentation-generator in your project. Claude Code loads it when a task matches its description.

How do I install Presentation Generator in Codex?

Run `npx skills add glebis/claude-skills --skill presentation-generator -a codex`. Or copy the skill folder (presentation-generator in glebis/claude-skills) into .agents/skills/presentation-generator in your project. Codex loads it when a task matches its description.

Can I use Presentation Generator in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add glebis/claude-skills --skill presentation-generator -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/presentation-generator, .gemini/skills/presentation-generator, .github/skills/presentation-generator and .opencode/skills/presentation-generator in your project.

What does Presentation Generator need to run?

Going by SKILL.md and its folder, Presentation Generator needs JavaScript for the scripts in its folder and the command-line tools its instructions call (node and npm). Our summary lists: Node.js.

Does Presentation Generator access the network?

SKILL.md contains no URLs. Its commands use npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Presentation Generator safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Presentation Generator use?

Presentation Generator is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Presentation Generator use?

About 1.5k tokens (SKILL.md is roughly 6.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Presentation Generator?

Skills that share tags, products or a category with Presentation Generator: Wowerpoint Slide Decks (thedotmack/claude-mem, 97k stars), Fetch Slides (pamelafox/presentation-skills, 125 stars), Obsidian Canvas Export (AgriciDaniel/claude-canvas, 299 stars) and Create Chatgpt Video Ad (criptogus/agent-evolve-network, 288 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Presentation Generator?

glebis (a GitHub user) maintains it in glebis/claude-skills, which has 388 GitHub stars. The repository holds 91 skills in this directory. The repository was last updated on September 26, 2026.

Source: glebis/claude-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.