mcpField
H
html-to-pptx

html-to-pptx

github.com/aviz85Documents50147 installsUpdated 16w ago
Repository

About html-to-pptx

html-to-pptx is a skill that converts HTML files or URLs into PowerPoint presentations using PptxGenJS. It offers editable text, image-based rendering, automatic mode selection, and support for Hebrew and RTL layouts.

Key features

  1. 01Convert HTML files and URLs
  2. 02Choose text, image, or auto mode
  3. 03Support Hebrew and RTL layouts
  4. 04Split slides by CSS selector
  5. 05Customize layout, fonts, and styling

Use cases

  1. 01Turn an HTML document into editable slides
  2. 02Convert a web page into a presentation
  3. 03Preserve complex layouts as slide images

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/aviz85/claude-skills-library --skill html-to-pptx

After installing, type/html-to-pptxin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

package.json
README.md
SETUP.md
scripts/
html-to-pptx.js

Details

From the project README

HTML to PowerPoint Converter

First time? If setup_complete: false above, run ./SETUP.md first, then set setup_complete: true.

Convert HTML to PowerPoint (.pptx) with excellent Hebrew/RTL support using PptxGenJS.

Setup (One-time)

cd ~/.claude/skills/html-to-pptx && npm install

Quick Usage

Basic conversion:
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js input.html output.pptx
Hebrew document with RTL:
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js hebrew.html presentation.pptx --rtl
Convert URL to PowerPoint:
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js https://example.com slides.pptx
Complex HTML as images (pixel-perfect):
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js complex.html slides.pptx --mode=image

Conversion Modes

ModeDescriptionBest For
textParse HTML, create native PPTX elementsSimple HTML, editable text
imageScreenshot HTML, embed as imagesComplex layouts, exact rendering
autoAuto-detect best modeDefault

Options

OptionDescriptionDefault
--mode=<mode>text, image, autoauto
--rtlForce RTL for Hebrew/Arabicauto-detect
--title=<title>Presentation titleauto
--author=<author>Author nameAVIZ
--layout=<layout>LAYOUT_16x9, LAYOUT_4x3LAYOUT_16x9
--font=<font>Default fontHeebo (Hebrew) / Arial
--font-size=<size>Font size in points18
--background=<color>Background color (hex)-
--slide-per=<selector>Split slides by CSS selector-
--wait=<ms>Wait for rendering (image mode)2000

Examples

Hebrew presentation:
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js hebrew.html slides.pptx --rtl --font=Heebo
Split by sections:
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js doc.html slides.pptx --slide-per=section
Custom styling:
node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js doc.html slides.pptx --font=David --font-size=24 --background=F5F5F5
Pipe HTML:
echo "<h1>שלום עולם</h1>" | node ~/.claude/skills/html-to-pptx/scripts/html-to-pptx.js - output.pptx --rtl

Hebrew Best Practices

  1. Use <html lang="he" dir="rtl"> in HTML
  2. Always add --rtl flag
  3. Use Hebrew-supporting fonts: Heebo, David, Noto Sans Hebrew
  4. For complex layouts, use --mode=image for pixel-perfect results

Slide Structure

The converter auto-detects slide boundaries:

  1. <section> elements
  2. <article> elements
  3. .slide class
  4. <hr> elements

Or use --slide-per=".my-slide" for custom selectors.

Comments

Markdown supported