PPTX Generator & Editor Overview This skill handles all PowerPoint tasks: reading/analyzing existing presentations, editing template-based decks via XML manipulation, and creating presentations from scratch using PptxGenJS. It includes a complete design system (color palettes, fonts, style recipes) and detailed guidance for every slide type. Quick Reference Task Approach Read/analyze content python -m markitdown presentation.pptx Edit or create from template See Editing Presentations Create from scratch See Creating from Scratch below Item Value Dimensions 10" x 5.625" (LAYOUT_16x9) Colors 6-char hex without # (e.g., "FF0000" ) English font Arial (default), or approved alternatives Chinese font Microsoft YaHei Page badge position x: 9.3", y: 5.1" Theme keys primary , secondary , accent , light , bg Shapes RECTANGLE, OVAL, LINE, ROUNDED_RECTANGLE Charts BAR, LINE, PIE, DOUGHNUT, SCATTER, BUBBLE, RADAR Reference Files File Contents slide-types.md 5 slide page types (Cover, TOC, Section Divider, Content, Summary) + additional layout patterns design-system.md Color palettes, font reference, style recipes (Sharp/Soft/Rounded/Pill), typography & spacing editing.md Template-based editing workflow, XML manipulation, formatting rules, common pitfalls pitfalls.md QA process, common mistakes, critical PptxGenJS pitfalls pptxgenjs.md Complete PptxGenJS API reference Reading Content
Text extraction
- python
- -m
- markitdown presentation.pptx
- Creating from Scratch — Workflow
- Use when no template or reference presentation is available.
- Step 1: Research & Requirements
- Search to understand user requirements — topic, audience, purpose, tone, content depth.
- Step 2: Select Color Palette & Fonts
- Use the
- Color Palette Reference
- to select a palette matching the topic and audience. Use the
- Font Reference
- to choose a font pairing.
- Step 3: Select Design Style
- Use the
- Style Recipes
- to choose a visual style (Sharp, Soft, Rounded, or Pill) matching the presentation tone.
- Step 4: Plan Slide Outline
- Classify
- every slide
- as exactly one of the
- 5 page types
- . Plan the content and layout for each slide. Ensure visual variety — do NOT repeat the same layout across slides.
- Step 5: Generate Slide JS Files
- Create one JS file per slide in
- slides/
- directory. Each file must export a synchronous
- createSlide(pres, theme)
- function. Follow the
- Slide Output Format
- and the type-specific guidance in
- slide-types.md
- . Generate up to 5 slides concurrently using subagents if available.
- Tell each subagent:
- File naming:
- slides/slide-01.js
- ,
- slides/slide-02.js
- , etc.
- Images go in:
- slides/imgs/
- Final PPTX goes in:
- slides/output/
- Dimensions: 10" x 5.625" (LAYOUT_16x9)
- Fonts: Chinese = Microsoft YaHei, English = Arial (or approved alternative)
- Colors: 6-char hex without # (e.g.
- "FF0000"
- )
- Must use the theme object contract (see
- Theme Object Contract
- )
- Must follow the
- PptxGenJS API reference
- Step 6: Compile into Final PPTX
- Create
- slides/compile.js
- to combine all slide modules:
- // slides/compile.js
- const
- pptxgen
- =
- require
- (
- 'pptxgenjs'
- )
- ;
- const
- pres
- =
- new
- pptxgen
- (
- )
- ;
- pres
- .
- layout
- =
- 'LAYOUT_16x9'
- ;
- const
- theme
- =
- {
- primary
- :
- "22223b"
- ,
- // dark color for backgrounds/text
- secondary
- :
- "4a4e69"
- ,
- // secondary accent
- accent
- :
- "9a8c98"
- ,
- // highlight color
- light
- :
- "c9ada7"
- ,
- // light accent
- bg
- :
- "f2e9e4"
- // background color
- }
- ;
- for
- (
- let
- i
- =
- 1
- ;
- i
- <=
- 12
- ;
- i
- ++
- )
- {
- // adjust count as needed
- const
- num
- =
- String
- (
- i
- )
- .
- padStart
- (
- 2
- ,
- '0'
- )
- ;
- const
- slideModule
- =
- require
- (
- `
- ./slide-
- ${
- num
- }
- .js
- `
- )
- ;
- slideModule
- .
- createSlide
- (
- pres
- ,
- theme
- )
- ;
- }
- pres
- .
- writeFile
- (
- {
- fileName
- :
- './output/presentation.pptx'
- }
- )
- ;
- Run with:
- cd slides && node compile.js
- Step 7: QA (Required)
- See
- QA Process
- .
- Output Structure
- slides/
- ├── slide-01.js # Slide modules
- ├── slide-02.js
- ├── ...
- ├── imgs/ # Images used in slides
- └── output/ # Final artifacts
- └── presentation.pptx
- Slide Output Format
- Each slide is a
- complete, runnable JS file
- :
- // slide-01.js
- const
- pptxgen
- =
- require
- (
- "pptxgenjs"
- )
- ;
- const
- slideConfig
- =
- {
- type
- :
- 'cover'
- ,
- index
- :
- 1
- ,
- title
- :
- 'Presentation Title'
- }
- ;
- // MUST be synchronous (not async)
- function
- createSlide
- (
- pres
- ,
- theme
- )
- {
- const
- slide
- =
- pres
- .
- addSlide
- (
- )
- ;
- slide
- .
- background
- =
- {
- color
- :
- theme
- .
- bg
- }
- ;
- slide
- .
- addText
- (
- slideConfig
- .
- title
- ,
- {
- x
- :
- 0.5
- ,
- y
- :
- 2
- ,
- w
- :
- 9
- ,
- h
- :
- 1.2
- ,
- fontSize
- :
- 48
- ,
- fontFace
- :
- "Arial"
- ,
- color
- :
- theme
- .
- primary
- ,
- bold
- :
- true
- ,
- align
- :
- "center"
- }
- )
- ;
- return
- slide
- ;
- }
- // Standalone preview - use slide-specific filename
- if
- (
- require
- .
- main
- ===
- module
- )
- {
- const
- pres
- =
- new
- pptxgen
- (
- )
- ;
- pres
- .
- layout
- =
- 'LAYOUT_16x9'
- ;
- const
- theme
- =
- {
- primary
- :
- "22223b"
- ,
- secondary
- :
- "4a4e69"
- ,
- accent
- :
- "9a8c98"
- ,
- light
- :
- "c9ada7"
- ,
- bg
- :
- "f2e9e4"
- }
- ;
- createSlide
- (
- pres
- ,
- theme
- )
- ;
- pres
- .
- writeFile
- (
- {
- fileName
- :
- "slide-01-preview.pptx"
- }
- )
- ;
- }
- module
- .
- exports
- =
- {
- createSlide
- ,
- slideConfig
- }
- ;
- Theme Object Contract (MANDATORY)
- The compile script passes a theme object with these
- exact keys
- :
- Key
- Purpose
- Example
- theme.primary
- Darkest color, titles
- "22223b"
- theme.secondary
- Dark accent, body text
- "4a4e69"
- theme.accent
- Mid-tone accent
- "9a8c98"
- theme.light
- Light accent
- "c9ada7"
- theme.bg
- Background color
- "f2e9e4"
- NEVER use other key names
- like
- background
- ,
- text
- ,
- muted
- ,
- darkest
- ,
- lightest
- .
- Page Number Badge (REQUIRED)
- All slides
- except Cover Page
- MUST include a page number badge in the bottom-right corner.
- Position
- x: 9.3", y: 5.1" Show current number only (e.g. 3 or 03 ), NOT "3/12" Use palette colors, keep subtle Circle Badge (Default) slide . addShape ( pres . shapes . OVAL , { x : 9.3 , y : 5.1 , w : 0.4 , h : 0.4 , fill : { color : theme . accent } } ) ; slide . addText ( "3" , { x : 9.3 , y : 5.1 , w : 0.4 , h : 0.4 , fontSize : 12 , fontFace : "Arial" , color : "FFFFFF" , bold : true , align : "center" , valign : "middle" } ) ; Pill Badge slide . addShape ( pres . shapes . ROUNDED_RECTANGLE , { x : 9.1 , y : 5.15 , w : 0.6 , h : 0.35 , fill : { color : theme . accent } , rectRadius : 0.15 } ) ; slide . addText ( "03" , { x : 9.1 , y : 5.15 , w : 0.6 , h : 0.35 , fontSize : 11 , fontFace : "Arial" , color : "FFFFFF" , bold : true , align : "center" , valign : "middle" } ) ; Dependencies pip install "markitdown[pptx]" — text extraction npm install -g pptxgenjs — creating from scratch npm install -g react-icons react react-dom sharp — icons (optional)