skills.rest
istinataFTS
istinataFTSCOMMUNITY
Explore all skills by this author →
GitHub

ckm:slides

Automate HTML presentation creation with Chart.js and design tokens.

2|1|Updated Sep 25, 2025
Search Tags:#copywriting#design tokens#presentation automation#presentation design#Chart.js#responsive layout
One-click install
npx skills add https://github.com/istinataFTS/LiftLeagueLegends --skill ckm-slides-istinatafts
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ckm:slides
Source: https://github.com/istinataFTS/LiftLeagueLegends/tree/main/fitness_tracker/.claude/skills/slides
Command: npx skills add https://github.com/istinataFTS/LiftLeagueLegends --skill ckm-slides-istinatafts

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the creation of strategic HTML presentations with Chart.js, design tokens, and responsive layouts, streamlining the process for users without technical expertise.

Core Features & Use Cases

  • Strategic HTML Presentation Design: Leverages Chart.js for data visualization and design tokens for consistency across slides.
  • Responsive Layouts: Ensures presentations look great on any device.
  • Copywriting Formulas: Enhances the content's effectiveness with proven copywriting techniques.
  • Use Case: Ideal for marketing professionals or data analysts who need to create compelling and informative presentations quickly.

Quick Start

Generate a presentation on "Project Success Metrics" with 5 slides.

Frequently Asked Questions about ckm:slides

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

FAQPage Schema
How do I build HTML presentations with Chart.js data visualizations automatically?▼

You can build HTML presentations with Chart.js by automating slide creation, applying design tokens for theme consistency, and generating responsive layouts for cross-device compatibility without manual coding.

What's the best way to maintain theme consistency across responsive presentation slides?▼

Maintain theme consistency across responsive presentation slides by applying design tokens, which standardize visual properties throughout the HTML deck and ensure cross-device compatibility without manual adjustments.

Can I use copywriting formulas for strategic presentation design without technical expertise?▼

Yes, you can apply proven copywriting formulas for strategic presentation design without technical expertise, as the process automates structured content creation alongside Chart.js data visualization and responsive layout generation.

Does Chart.js work with responsive layouts for marketing data presentations?▼

Chart.js works seamlessly with responsive layouts for marketing data presentations, ensuring data visualizations scale correctly across devices while design tokens maintain visual consistency throughout the slides.

How do I generate a 5-slide project metrics presentation with data visualization?▼

Generate a project metrics presentation by requesting a specific slide count and topic, which triggers automated HTML creation with Chart.js visualizations, design tokens, and structured copywriting for immediate use.

Related Skills

Explore More Design & Creative Skills→
HerxinsasaHerxinsasa
1

ckm:slides

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

Community
Intermediate
marcocellomarcocello
10

html-presentations

Create standalone HTML presentation decks with semantic slide structure and embedded styling.

Community
Advanced
dmccrearydmccreary
90

chartjs-generator

Generate interactive Chart.js visualizations with HTML, CSS, and documentation packages.

Community
Intermediate
luicabref97luicabref97

ckm:design-system

Generate and validate design tokens, component specs, and slide HTML.

Community
Advanced