ckm:slides

Creates strategic HTML presentations with integrated Chart.js data visualization and responsive design tokens.

1|Updated Apr 22, 2026
One-click install
npx skills add https://github.com/Herxinsasa/Skills-Collector --skill ckm-slides-herxinsasa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ckm:slides
Source: https://github.com/Herxinsasa/Skills-Collector/tree/main/ui-ux-pro-max-skill/.claude/skills/slides
Command: npx skills add https://github.com/Herxinsasa/Skills-Collector --skill ckm-slides-herxinsasa

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Creating professional, data-driven HTML presentations requires design expertise, copywriting skills, and technical implementation knowledge, which is time-consuming and difficult to coordinate without a systematic approach.

Core Features & Use Cases

  • Strategic Slide Design: 25 proven layout patterns including title slides, feature grids, metrics dashboards, and pricing cards with responsive CSS structures and animation classes.
  • Copywriting Formulas: 25 persuasive copywriting frameworks such as PAS, AIDA, and FAB mapped to specific slide types and emotional arcs for maximum impact.
  • Data Visualization: Native Chart.js integration for embedding interactive line, bar, doughnut, and radar charts with design token theming and responsive containers.
  • Deck Strategies: 15 proven presentation structures including YC Seed Deck, Sales Pitch, Product Demo, and Conference Talk with defined emotion arcs and slide sequences.
  • Use Case: A startup founder can use this skill to generate a complete investor pitch deck with problem-solution framing, traction metrics, and revenue charts in minutes.

Quick Start

Use the slides skill to create a 10-slide YC seed deck presentation about your SaaS product with Chart.js revenue charts and persuasive copywriting formulas.

Frequently Asked Questions about ckm:slides

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

FAQPage Schema
How do I build an HTML presentation with Chart.js data visualization?

You can build an HTML presentation with Chart.js by applying structured layout patterns and CSS custom properties for theming, rendering interactive line, bar, doughnut, and radar charts within responsive containers. This approach embeds data visualization directly into strategic pitch decks.

What persuasive copywriting frameworks work best for pitch deck slides?

Persuasive copywriting frameworks like PAS, AIDA, and FAB work best for pitch deck slides because they map directly to specific slide types and emotional arcs. This mapping ensures maximum impact for investor presentations and marketing pitches.

Can I create a YC seed deck presentation using HTML and Chart.js?

Yes, you can create a YC seed deck presentation using HTML and Chart.js by following 15 proven deck strategies with defined emotional arcs and slide sequences. This allows startup founders to generate complete investor pitch decks with traction metrics and revenue charts.

Do I need Chart.js to render interactive charts in responsive HTML slides?

Yes, you need Chart.js to render interactive charts in responsive HTML presentations because it provides the native visualization integration for embedding line, bar, doughnut, and radar charts. The slides rely on Chart.js alongside CSS custom properties for design token theming.

What is the best way to structure a product demo presentation with metrics dashboards?

The best way to structure a product demo presentation with metrics dashboards is to use proven layout patterns like feature grids and pricing cards combined with responsive CSS structures. Applying a defined deck strategy ensures the emotional arc matches the product demonstration flow.

Why use CSS custom properties for theming HTML presentations instead of static stylesheets?

Using CSS custom properties for theming HTML presentations instead of static stylesheets enables dynamic design token systems that easily adapt across 25 responsive layout patterns. This ensures consistent visual theming for strategic slide designs and embedded Chart.js data visualization.