skills.rest
xxih
xxihCOMMUNITY
Explore all skills by this author →
GitHub

frontend-slides

Generate animation-rich HTML presentations from PowerPoint files or raw content.

1|Updated Mar 18, 2026
Search Tags:#html#accessibility#css#presentation#animation#slides#ppt
One-click install
npx skills add https://github.com/xxih/ai-harness-zh --skill frontend-slides-xxih
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-slides
Source: https://github.com/xxih/ai-harness-zh/tree/main/references/translations/everything-claude-code/docs/zh-CN/skills/frontend-slides
Command: npx skills add https://github.com/xxih/ai-harness-zh --skill frontend-slides-xxih

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It eliminates the need for heavy design tools by letting users create fully animated, viewport‑fit HTML presentations directly from plain concepts or PowerPoint files, ensuring zero‑dependency, responsive slides.

Core Features & Use Cases

  • Zero‑dependency HTML output: Generates a single self‑contained HTML file with inline CSS and JavaScript.
  • PowerPoint conversion: Extracts text, images, and speaker notes from .ppt or .pptx files using python‑pptx when available.
  • Style exploration: Offers visual previews of three design presets before finalizing.
  • Viewport and accessibility compliance: Enforces CSS rules for full‑screen slides, responsive scaling, and reduced‑motion preferences.
  • Use Cases: Marketing decks, technical talks, internal briefings, or rapid prototyping of slide decks without graphic designers.

Quick Start

Create a 12‑slide HTML presentation about sustainable design using the frontend‑slides skill.

Frequently Asked Questions about frontend-slides

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert a PowerPoint presentation to an animated HTML file?▼

To convert PowerPoint to animated HTML, this Skill extracts text, images, and speaker notes from .ppt or .pptx files using python-pptx, then generates a single self-contained HTML file with inline CSS and JavaScript animations.

Can I create HTML slides from plain text without needing external design tools?▼

Yes, you can create HTML slides from plain text or raw concepts directly in the browser. This Skill generates a zero-dependency, self-contained HTML file with inline CSS and JavaScript, eliminating the need for heavy design tools.

Do I need external libraries to display the generated HTML presentations in a browser?▼

No, you do not need external libraries. The generated HTML presentations are fully self-contained with inline CSS and JavaScript, ensuring zero external dependencies while running directly in the browser.

Does the generated HTML presentation support accessibility and responsive scaling?▼

Yes, the generated HTML presentation supports accessibility and responsive scaling. It enforces CSS rules for full-screen viewport-fitting slides, responsive layout, and reduced-motion preferences to comply with accessibility standards.

What is the best way to make a marketing deck without using graphic design software?▼

The best way to make a marketing deck without graphic design software is generating animation-rich HTML presentations from raw content. This Skill offers visual previews of three design presets before finalizing a fully animated, responsive deck.

Related Skills

Explore More Design & Creative Skills→
kivo360kivo360
71

pptx

Create and edit PowerPoint presentations programmatically with Node.js and Python libraries.

Community
Advanced
jacardljacardl

p5js

Build and export p5.js generative art projects as HTML, PNG, GIF, MP4, or SVG.

Community
Advanced
samymitysamymity
1

frontend-slides

Generate zero-dependency HTML slide decks with viewport-fit animations and navigation.

Community
Advanced
Maccio-huangMaccio-huang

html-ppt-zhangzara-block-frame

Create a neobrutalist presentation template using HTML and CSS.

Community
Intermediate