Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
tfriedel avatar

Pptx

  • 1.7k installs
  • 800 repo stars
  • Updated April 1, 2026
  • tfriedel/claude-office-skills

pptx is a skill that workflows for pptx

About

The pptx skill helps with workflows for pptx. Key workflows include HTML to PowerPoint Guide; Table of Contents; Creating HTML Slides; Layout Dimensions. Documented capabilities cover **16:9** (default): `width: 720pt; height: 405pt`; **4:3**: `width: 720pt; height: 540pt`; **16:10**: `width: 720pt; height: 450pt`; `<p>`, `<h1>`-`<h6>` - Text with styling; `<ul>`, `<ol>` - Lists (never use manual bullets •, -, *). Agents should invoke it when users ask about pptx or mention triggers defined in the skill frontmatter. Follow the SKILL.md steps, reference files, and output formats rather than improvising outside documented scope. 1. [Creating HTML Slides](#creating-html-slides) 2. [Using the html2pptx Library](#using-the-html2pptx-library) 3. [Using PptxGenJS](#using-pptxgenjs) --- ## Creating HTML Slides Every HTML slide must include proper body dimensions: ### Layout Dimensions - **16:9** (default): `width: 720pt; height: 405pt` - **4:3**: `width: 720pt; height: 540pt` - **16:10**: `width: 720pt; height: 450pt` ### Supported Elements - `<p>`, `<h1>`-`<h6>` - Text with styling - `<ul>`, `<ol>` - Lists (never use manual bullets •, -, *) - `<b>`, `<strong>` - Bold text (inline formatt.

  • HTML to PowerPoint Guide
  • Table of Contents
  • Creating HTML Slides
  • Layout Dimensions

Pptx by the numbers

  • 1,652 all-time installs (skills.sh)
  • +11 installs in the week ending Aug 2, 2026 (Skillselion tracking)
  • Ranked #123 of 687 Office & Documents skills by installs in the Skillselion catalog
  • Security screen: HIGH risk (skills.sh audit)
  • Data as of Aug 2, 2026 (Skillselion catalog sync)
At a glance

pptx capabilities & compatibility

Capabilities
html to powerpoint guide · table of contents · creating html slides · layout dimensions
Use cases
planning · research
npx skills add https://github.com/tfriedel/claude-office-skills --skill pptx

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs1.7k
repo stars800
Security audit1 / 3 scanners passed
Last updatedApril 1, 2026
Repositorytfriedel/claude-office-skills

How do I apply pptx for pptx tasks?

workflows for pptx

Who is it for?

Teams using pptx as documented in the skill repository.

Skip if: Tasks outside the pptx scope in SKILL.md.

When should I use this skill?

User mentions pptx, pptx, or related skill triggers.

What you get

Structured guidance and deliverables from the pptx SKILL.md workflow.

  • .pptx presentation file

By the numbers

  • Supports 3 slide layouts: 16:9, 4:3, and 16:10
  • Maps 6+ HTML element types to PowerPoint shapes

Files

SKILL.mdMarkdownGitHub ↗

HTML to PowerPoint Guide

Convert HTML slides to PowerPoint presentations with accurate positioning using the html2pptx.js library.

Table of Contents

1. Creating HTML Slides 2. Using the html2pptx Library 3. Using PptxGenJS

---

Creating HTML Slides

Every HTML slide must include proper body dimensions:

Layout Dimensions

  • 16:9 (default): width: 720pt; height: 405pt
  • 4:3: width: 720pt; height: 540pt
  • 16:10: width: 720pt; height: 450pt

Supported Elements

  • <p>, <h1>-<h6> - Text with styling
  • <ul>, <ol> - Lists (never use manual bullets •, -, *)
  • <b>, <strong> - Bold text (inline formatting)
  • <i>, <em> - Italic text (inline formatting)
  • <u> - Underlined text (inline formatting)
  • <span> - Inline formatting with CSS styles (bold, italic, underline, color)
  • <div> with bg/border - Becomes shape
  • <img> - Images
  • class="placeholder" - Reserved space for charts (returns { id, x, y, w, h })

Critical Text Rules

ALL text MUST be inside `<p>`, `<h1>`-`<h6>`, `<ul>`, or `<ol>` tags:

  • ✅ Correct: <div><p>Text here</p></div>
  • ❌ Wrong: <div>Text here</div> - Text will NOT appear in PowerPoint
  • ❌ Wrong: <span>Text</span> - Text will NOT appear in PowerPoint
  • Text in <div> or <span> without a text tag will be silently ignored

NEVER use `<br>` tags - Use separate text elements for each line

*NEVER use manual bullet symbols (•, -, , etc.)** - Use <ul> or <ol> lists instead

ONLY use web-safe fonts that are universally available:

  • ✅ Web-safe fonts: Arial, Helvetica, Times New Roman, Georgia, Courier New, Verdana, Tahoma, Trebuchet MS, Impact, Comic Sans MS
  • ❌ Wrong: 'Segoe UI', 'SF Pro', 'Roboto', custom fonts - Might cause rendering issues

Styling

  • Use display: flex on body to prevent margin collapse from breaking overflow validation
  • Use margin for spacing (padding included in size)
  • Inline formatting: Use <b>, <i>, <u> tags OR <span> with CSS styles
  • <span> supports: font-weight: bold, font-style: italic, text-decoration: underline, color: #rrggbb
  • <span> does NOT support: margin, padding (not supported in PowerPoint text runs)
  • Example: <span style="font-weight: bold; color: #667eea;">Bold blue text</span>
  • Flexbox works - positions calculated from rendered layout
  • Use hex colors with # prefix in CSS
  • Text alignment: Use CSS text-align (center, right, etc.) when needed as a hint to PptxGenJS for text formatting if text lengths are slightly off

Shape Styling (DIV elements only)

IMPORTANT: Backgrounds, borders, and shadows only work on `<div>` elements, NOT on text elements (`<p>`, `<h1>`-`<h6>`, `<ul>`, `<ol>`)

  • Backgrounds: CSS background or background-color on <div> elements only
  • Example: <div style="background: #f0f0f0;"> - Creates a shape with background
  • Borders: CSS border on <div> elements converts to PowerPoint shape borders
  • Supports uniform borders: border: 2px solid #333333
  • Supports partial borders: border-left, border-right, border-top, border-bottom (rendered as line shapes)
  • Example: <div style="border-left: 8pt solid #E76F51;">
  • Border radius: CSS border-radius on <div> elements for rounded corners
  • border-radius: 50% or higher creates circular shape
  • Percentages <50% calculated relative to shape's smaller dimension
  • Supports px and pt units (e.g., border-radius: 8pt;, border-radius: 12px;)
  • Example: <div style="border-radius: 25%;"> on 100x200px box = 25% of 100px = 25px radius
  • Box shadows: CSS box-shadow on <div> elements converts to PowerPoint shadows
  • Supports outer shadows only (inset shadows are ignored to prevent corruption)
  • Example: <div style="box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);">
  • Note: Inset/inner shadows ar

Related skills

How it compares

Use pptx for HTML-driven deck automation; use design skills when visual branding and custom illustration matter more than programmatic layout.

FAQ

What does pptx do?

workflows for pptx

When should I use pptx?

When you need pptx help per SKILL.md.

Is pptx safe to install?

Review the Security Audits panel on this page before installing in production.

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.