skills.rest
Grupo-6-ADS-B
Grupo-6-ADS-BOFFICIAL
Explore all skills by this author →
GitHub

ckm:slides

Creates strategic HTML presentations with Chart.js charts, design tokens, and copywriting formulas.

2|Updated Aug 15, 2025
Search Tags:#data visualization#copywriting#presentation#slide design#pitch deck#chart.js#html slides
One-click install
npx skills add https://github.com/Grupo-6-ADS-B/FittNutri --skill ckm-slides-grupo-6-ads-b
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ckm:slides
Source: https://github.com/Grupo-6-ADS-B/FittNutri/tree/main/.claude/skills/slides
Command: npx skills add https://github.com/Grupo-6-ADS-B/FittNutri --skill ckm-slides-grupo-6-ads-b

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Building persuasive, well-designed presentations from scratch requires juggling layout design, data visualization, and persuasive copywriting, which is time-consuming and often produces inconsistent results. ## Core Features & Use Cases - HTML Slide Generation: Produces complete responsive slide decks with 16:9 aspect ratio, keyboard navigation, progress bars, and animation classes. - Data Visualization: Integrates Chart.js for line, bar, doughnut, and radar charts styled with design tokens. - Strategic Content Guidance: Provides 25 copywriting formulas (PAS, AIDA, FAB), 25 layout patterns, and 15 deck strategies (YC Seed Deck, Sales Pitch, Product Demo) with emotion arcs. - Use Case: A founder preparing a seed-round pitch can generate a 10-slide YC-style deck with traction charts, problem-solution narrative, and a closing CTA in a single self-contained HTML file. ## Quick Start Use the slides skill to create a 10-slide investor pitch deck about my SaaS product with a revenue growth chart.

Frequently Asked Questions about ckm:slides

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create an HTML presentation with Chart.js charts?▼

Use the slides skill with a topic and slide count to generate a self-contained HTML deck. It embeds Chart.js from CDN for line, bar, doughnut, and radar charts, styled with CSS design tokens and responsive breakpoints.

What slide deck structure works best for investor pitches?▼

The skill includes the YC Seed Deck structure with 10 slides covering problem, solution, traction, market, and the ask. It also supports Guy Kawasaki and Series A formats, each with a defined emotion arc from curiosity to urgency.

Does the generated presentation work on mobile devices?▼

Yes, the HTML template includes responsive breakpoints for tablet and mobile with clamp-based typography scaling. On desktop it locks to a 16:9 aspect ratio with letterboxing, while smaller screens get adjusted padding and font sizes.

Which copywriting formula should I use for a problem slide?▼

Use PAS (Problem-Agitate-Solution) for problem slides to build frustration, or Cost of Inaction for urgency. The skill maps formulas to slide types, pairing each with an appropriate emotional trigger.

Can I navigate the slides with a keyboard?▼

Yes, the generated deck supports arrow keys and spacebar for navigation, plus click-to-advance and on-screen navigation buttons. A progress bar and slide counter track the current position automatically.

Related Skills

Explore More Marketing & Sales Skills→
fivebucksventuresfivebucksventures

campaign-presenter

Generate campaign slide decks from briefs and research notes.

Official
Advanced
shekerkammashekerkamma

presentation-exporter

Export HTML presentations to PDF, PNG, and markdown speaker notes.

Community
Intermediate
TumeloRamaphosaTumeloRamaphosa

ckm:design-system

Generate token-compliant design tokens and brand-styled slide HTML.

Community
Advanced
MiniMax-AIMiniMax-AI
13.3k

ppt-editing-skill

Edit PPTX files through XML-safe unpack and repack workflows.

Official
Advanced