editorial-pptx-deck

A reusable Cursor Agent Skill that builds editable business PPTX decks in a clean, editorial‑minimalist style:

• White background, Georgia serif titles, a single red accent bar
• Full‑height photo section dividers
• Exports a real, double‑click‑editable .pptx (native text boxes) — no image‑only slides
• Deliverable is the .pptx only (HTML slides are just the build source)

The deck is authored as constrained HTML (one file per slide, fixed 1280×720 = 960×540pt), then translated element‑by‑element into PowerPoint objects via pptxgenjs.

Install

As a Cursor skill (recommended):

npx skills add sharonzhang98/editorial-pptx-deck

Then in Cursor, ask the agent for a deck in this style (e.g. "make a business pitch deck with editorial-pptx-deck").

Or clone manually into your skills folder:

git clone https://github.com/sharonzhang98/editorial-pptx-deck.git ~/.cursor/skills/editorial-pptx-deck

Runtime dependencies

Installed in the working project when building a deck:

npm i pptxgenjs playwright sharp && npx playwright install chromium

Usage

1. Scaffold a project: shared/ assets/ slides/ output/ (copy shared/tokens.css and the photos you want from this skill).
2. Author slides/NN-name.html from the files in templates/.
3. Check fit: node scripts/check_overflow.mjs --slides slides
4. Export: node scripts/export_deck_pptx.mjs --slides slides --out output/DeckName.pptx

Full guidance lives in SKILL.md; HTML→PPTX rules in reference.md.

What's inside

Path	Purpose
SKILL.md	Agent instructions, workflow, design system
reference.md	HTML→PPTX hard constraints & fixes
shared/tokens.css	Color + type tokens (swap --red to rebrand)
templates/	8 slide layouts (cover, divider, three‑column, mapping, compare table, dark contrast, pipeline, closing)
scripts/export_deck_pptx.mjs	The only export — HTML → editable PPTX
scripts/check_overflow.mjs	Pre‑export overflow check
scripts/html2pptx.js	Converter (Windows file:// path fix included)
assets/	Photo library for dividers/covers

Rebranding

Change --red (and optionally --ink-panel / the gold accent) in shared/tokens.css. Nothing else needs to change.

Notes

The photos in assets/ are provided as sample divider imagery. Replace them with your own licensed images for production/public use.

License

MIT