From claude-superskills
Creates Avanade-branded PowerPoint (.pptx) presentations using pptxgenjs with exact brand colors, fonts, layouts, waves, logos, and consistent elements per official guidelines.
npx claudepluginhub ericgandrade/claude-superskills --plugin claude-superskillsThis skill uses the workspace's default tool permissions.
You are building a fully branded Avanade PowerPoint presentation using pptxgenjs. Every slide must
Generates professional .pptx presentations using python-pptx with title/content slides, bullets, shapes, images, tables, and custom professional themes.
Generate, edit, and read PowerPoint presentations: create with PptxGenJS (cover/TOC/content/summary slides), edit via XML, extract text with markitdown.
Generates self-contained HTML slide presentations with keyboard navigation, swipe support, fullscreen, animations, embedded images, and brand-accurate styling from guides.
Share bugs, ideas, or general feedback.
You are building a fully branded Avanade PowerPoint presentation using pptxgenjs. Every slide must respect the Avanade visual identity exactly as described here. No improvisation on colors or fonts.
references/brand-guidelines.md for full color/font/layout specs before writing any codepptxgenjs.md in the installed skills, e.g. ~/.claude/skills/pptx/pptxgenjs.md) for pptxgenjs syntaxscripts/avanade_base.js as your starting point — copy it and extend it/Users/avanade/Desktop/Marketing/ and provide computer:// linkFONT: Segoe UI (all weights)
SLIDE SIZE: LAYOUT_16x9 (10" × 5.625")
COLORS — never use # prefix in pptxgenjs:
ORANGE: FF5800 ← Avanade Primary (Solar)
DARK_ORANGE: DC4600 ← Secondary orange (Pantone 159)
YELLOW: FFD700 ← Solar Yellow (Luminous Primary)
RED_ORANGE: B43C14 ← Flame (gradient mid-dark)
DEEP_PURPLE: 870032 ← Gradient end (Thermal/deep)
DARK_GRAY: 333333 ← Body text on light backgrounds
MED_GRAY: 666666 ← Secondary text / page numbers
WHITE: FFFFFF
LIGHT_ORANGE_BG: FFF0E8 ← Very light orange tint (callout boxes)
GRADIENT DIRECTION: Orange → Red → Purple (left-to-right or top-to-bottom)
Add these to every slide without exception:
| Element | Position | Style |
|---|---|---|
| Avanade logo | x:0.3, y:0.2, w:1.5, h:0.4 | White on dark/gradient; color PNG on white bg |
| "Do what matters" | x:6.5, y:0.25, w:3.2, h:0.3 | Segoe UI Semibold 12pt; white on dark, orange FF5800 on white |
| Copyright footer | x:2.5, y:5.3, w:5, h:0.2 | "©2026 Avanade Inc. All Rights Reserved." gray 999999 7pt center |
| Page number | x:9.4, y:5.3, w:0.4, h:0.2 | gray 999999 8pt right |
Logo image paths (use whichever fits):
scripts/logo_white.png (for dark/gradient backgrounds)scripts/logo_color.png (for white backgrounds)Read references/brand-guidelines.md for exact coordinates. Below is the decision guide:
Use for: first slide, executive summary intro, major section openers
Use for: chapter breaks, major topic transitions
Use for: table of contents, agenda, overview
Use for: feature explanations with visual support
Use for: same as above, alternating for visual variety
Use for: impactful moments, quotes, transition slides
Use for: detailed content, bullet lists, body-heavy slides
Use for: before/after, pros/cons, side-by-side comparison
Use for: key takeaways, steps, top-N lists
Use for: final slide
Add to footer if requested:
The Avanade "logo lines" are organic wave shapes in orange/red/yellow gradient. Since pptxgenjs doesn't support gradients natively, render them as SVG embedded as base64 image.
The scripts/avanade_base.js file includes a getWaveSVG(theme) function.
Use theme: 'orange' for white-background slides, theme: 'gradient' for dark slides.
FF5800 (not FF6600, not E85D00)333333) for body textreferences/brand-guidelines.md — full color specs, exact font sizes, layout coordinatesscripts/avanade_base.js — base pptxgenjs script to copy and extendRead references/brand-guidelines.md before starting any presentation.