An automated pipeline for creating professional, multi-page HTML presentations with integrated image generation and PPTX export capabilities using Openclaw Skills.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install html-presentation-generator
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install html-presentation-generator using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is HTML Presentation Generator?
The HTML Presentation Generator is a comprehensive tool designed to produce complete, high-fidelity slide decks using web technologies. It manages the entire presentation lifecycle, starting from deep domain research and color palette selection to individual slide generation and final deployment. Each slide is created as a standalone HTML file at a fixed 960x540px resolution, ensuring consistent layouts and typography.
Built specifically for the Openclaw Skills ecosystem, this tool prioritizes technical precision by enforcing strict CSS rules, such as mandatory Times New Roman fonts and inline-only styles. This ensures that the generated slides are not only visually appealing in a browser but also compatible with downstream conversion tools for PPTX and PDF formats.
HTML Presentation Generator Use Cases
- Creating corporate annual reports and financial summaries with professional data visualizations.
- Developing academic lecture slides that require specific serif typography and clean layouts.
- Generating automated marketing pitch decks with consistent branding across 18+ color palettes.
- Producing technical project reports that combine SVG diagrams with high-quality AI-generated imagery.
- Rapidly prototyping slide decks for internal team communications or status updates.
How HTML Presentation Generator Works
- Conduct domain research to validate information and organize findings for the slide content.
- Select a professional color palette and apply the mandatory Times New Roman font family.
- Create a slide-by-slide outline classifying pages into types like Cover, TOC, or Section Dividers.
- Generate up to 5 slides concurrently as individual HTML files with embedded SVG and generated images.
- Execute a visual verification loop by taking screenshots and using image understanding to check for text overlaps.
- Deploy the final deck using the deployment tool to merge all slides into a cohesive presentation package.
HTML Presentation Generator Setup
To get started with this skill, ensure your environment is configured for file generation and image processing. Follow these steps:
# Create the required directory structure
mkdir -p slides/imgs
# Ensure the responsive scaling snippet is present in your HTML templates
# The skill will automatically handle the 960x540px container logic
Configuration requires access to the GenerateImage and deploy_html_presentation tools within your agent environment. No external CSS libraries are needed as all styling is handled via inline rules for maximum portability.
HTML Presentation Generator Data Schema & Taxonomy
The skill organizes presentation assets using a specific file hierarchy and metadata structure:
| File/Element | Location | Purpose |
|---|---|---|
| Slide Files | slides/slide-XX.html |
Zero-padded HTML files for each slide |
| Image Assets | slides/imgs/ |
AI-generated visuals and chart exports |
| Main Container | .slide-content |
Fixed 960x540px resolution boundary |
| Typography | CSS Inline | Global use of 'Times New Roman', serif |
| Page Numbers | SVG Badge | Mandatory numbering on all slides except the cover |
HTML Presentation Generator Advanced Features
- Integrated AI Image Generation for automated creation of hero visuals and thematic backgrounds.
- Visual Regression Testing that uses screenshots to verify layout integrity before final deployment.
- Advanced SVG Constraints mapping to ensure complex diagrams remain editable in PPTX exports.
- Multi-page Lifecycle Management including automated Table of Contents and Section Divider generation.
- 18+ Predefined Professional Themes ranging from Modern Health to High-Tech Night modes.
SKILL.md
Loading
Related Openclaw Skills
General Mills Market Intelligence Skill
A high-fidelity knowledge skill providing deep-dive technical and financial data on General Mills for AI agents.
Video Gen Script Online
Transform text prompts or topics into professional video scripts and 1080p MP4 files using cloud GPU acceleration.
Cute Anime Girl AI Bikini Skill
A specialized AI skill to transform standard portrait or full-body photos into bikini model images or videos via the WeShop API.
Patagonia Brand Intelligence
A specialized data intelligence skill providing deep insights into Patagonia's sustainable business model, corporate history, and environmental leadership.
Job Market Intelligence & Career Tracker
A professional-grade market research tool that connects Claude to live job boards via Apify to track hiring trends, salary benchmarks, and in-demand skills.
IceCube Heartbeat
IceCube Heartbeat is a proactive maintenance system that enables AI agents to perform self-improvement, memory governance, and health checks during idle periods.
Featured*
