Slides Skill
A Claude Code /slides skill that turns a rough outline into a fully animated HTML slide deck in minutes, replacing PowerPoint and Google Slides.
Before & after
Same prompt, same agent — the only difference is the skill.
I can help you build a slide deck about your product roadmap. First, I'll need you to give me an outline of what you want to cover - the key themes, timelines, and milestones you want to highlight. Do you want each quarter in its own slide, or themes across quarters? What's your audience - internal team, investors, customers? Should I include specific feature names or keep it high-level? Once you provide an outline with the main points for each slide, I can create a deck for you, though you may want to refine the design and add your company logo afterward.
ANIMATED HTML SLIDE DECK GENERATED ╔═════════════════════════════════════════╗ ║ Product Roadmap 2026 - 2027 ║ ║ Fully animated, 10 slides ║ ║ Ready to present or share ║ ╚═════════════════════════════════════════╝ SLIDE 1: Title + Logo Fade-in animation, fade-out on advance SLIDE 2: 2026 Completed (full-width chart) Q1: Auth v2, API stability Q2: Mobile app, Dashboard redesign Slide animation: left-to-right progress bar SLIDE 3: Q3 2026 - In Progress Bullet points with staggered fade-in: • AI-powered insights engine (50% complete) • Integrations marketplace (30% complete) • Enterprise SSO (70% complete) Progress overlay animates as you present SLIDE 4: Q4 2026 - Starting Soon Three parallel initiatives with icons Workflow automation, Team collaboration, Analytics overhaul Slide transitions with scale-up effect SLIDE 5: H1 2027 Roadmap Timeline visualization with milestone dots (Jan) AI Features, (Feb) Automation, (Mar) Integrations Hover tooltips reveal detail on click SLIDE 6: Feature Deep Dive - AI Insights 3-column layout: Feature | Timeline | Value Prop Emphasis text animates in on advance SLIDE 7: Customer Impact Bar chart showing expected efficiency gains X-axis: feature rollout | Y-axis: time saved Chart bars animate in with data labels SLIDE 8: Dependencies & Risks 2 columns: green checkmarks (mitigated) | orange warnings (monitoring) Risk mitigation animates with icon swaps SLIDE 9: Investment & Resource Allocation Pie chart: engineering split by initiative Donut chart animates with percentages SLIDE 10: Closing + Q&A Key takeaways list, fade-in by line CUSTOMIZATION APPLIED: Color: Brand navy + accent gold Font: Playfair Display (headers) + Inter (body) Transitions: 400ms easing, consistent spacing Fully responsive for projector + mobile preview DELIVERABLE: Single HTML file, no dependencies Works offline, shareable as link Print to PDF or present in any browser
About this skill
name: slides-skill-peter-yang description: Use when A Claude Code /slides skill that turns a rough outline into a fully animated HTML slide deck in minutes, replacing PowerPoint and Google Slides.
Slides Skill
the original author built a custom /slides skill with 12 slide formats and 3 templates that takes a rough outline and produces a polished, animated HTML deck without manual slide design.
What you get
- A written tutorial breaking down the 6 steps that make the skill work, plus what's inside the skill file itself.
Customize your output
- Swap in your own 3 templates, adjust the 12 available slide formats, or add new ones.
Example output
A full animated HTML deck generated in about 3 minutes, demoed live in the video.
Best for
Founders, marketers, and product people who build a lot of decks.
SKILL.md preview
---
name: slides-skill-peter-yang
description: Use this skill when a rough outline needs to become a fully formatted, animated HTML slide deck instead of building slides manually in PowerPoint or Google Slides.
version: 1.0.0
category: Productivity / Presentations
author: AgentVolt
license: proprietary
tags:
- productivity
- presentations
- standard
---
# Slides Skill
Turns a rough outline into a polished, animated HTML slide deck, selecting from a set of slide formats and templates instead of manual slide-by-slide design.
## When to use
… (sign up to view the full skill)More productivity skills
View all Productivity skills →AI Productivity System
A complete AI-driven system for planning your day, triaging tasks, and shipping more without burning out.
Inbox Zero Workflow
An opinionated triage loop that gets a buried inbox to zero in about twenty minutes.
Calendar Triage
Reviews the week ahead, flags where you are overcommitted, and suggests what to cut or move.
Slack Catch-Up Agent
Summarizes what you missed across your Slack channels overnight, ranked by what needs a reply.