skills.rest
VickyVignesh0913
VickyVignesh0913COMMUNITY
Explore all skills by this author →
GitHub

ckm:slides

Generate strategic HTML slide decks with Chart.js visualizations and design tokens.

Updated Aug 23, 2026
Search Tags:#html#presentation#slides#responsive#chart.js#design-tokens#layout-patterns
One-click install
npx skills add https://github.com/VickyVignesh0913/Study-OS --skill ckm-slides-vickyvignesh0913
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ckm:slides
Source: https://github.com/VickyVignesh0913/Study-OS/tree/main/ui-ux-pro-max-skill-main/ui-ux-pro-max-skill-main/.claude/skills/slides
Command: npx skills add https://github.com/VickyVignesh0913/Study-OS --skill ckm-slides-vickyvignesh0913

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill enables rapid creation of strategic HTML slide decks that combine data visuals, design tokens, and proven layout patterns, reducing production time and maintaining consistency across decks.

Core Features & Use Cases

  • Build responsive HTML slides with integrated Chart.js charts and token-driven styling.
  • Apply layout patterns for opening, problem, solution, and closing segments to tell persuasive stories.
  • Reuse knowledge base references to assemble templates, formulas, and patterns for quick, high-quality presentations.

Quick Start

Create a 5- to 9-slide deck by applying the templates to your topic, then customize colors and charts.

Frequently Asked Questions about ckm:slides

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

FAQPage Schema
How do I generate responsive HTML slides with integrated Chart.js visualizations?▼

To generate responsive HTML slides with Chart.js, this skill applies reusable layout patterns and design tokens to your topic, producing a 5- to 9-slide deck with integrated data visualizations and token-driven styling.

Can I use design tokens for consistent styling across HTML presentation decks?▼

Yes, you can use design tokens for consistent HTML presentation styling. The skill enforces a token-driven approach to maintain visual consistency across decks while leveraging copywriting formulas for persuasive storytelling.

What is the best way to structure a data storytelling presentation using HTML?▼

The best way to structure an HTML data storytelling presentation is by applying predefined layout patterns for opening, problem, solution, and closing segments to tell persuasive stories with integrated Chart.js templates.

How do I create strategic marketing slides without starting from scratch?▼

You create strategic marketing slides by routing subcommands to the skill's knowledge base references, assembling reusable templates and copywriting formulas into a customized deck quickly without starting from scratch.

Does this HTML slide generator require external dependencies or libraries?▼

No external dependencies are required to run the skill itself, though the generated HTML output leverages Chart.js internally for rendering data visualizations and applies frontmatter-driven routing for knowledge base assembly.

Related Skills

Explore More Design & Creative Skills→
Veloxia-agencyVeloxia-agency

ckm:slides

Generate HTML presentation decks from a topic and slide count with Chart.js visualizations.

Community
Advanced
pekralpekral

frontend-slides

Generate self-contained HTML presentation decks with vanilla CSS and JavaScript.

Community
Intermediate
gokul12072006gokul12072006

slides

Design HTML presentations with Chart.js data visualizations and responsive layouts.

Community
Intermediate
pedroapp100pedroapp100

pptx

Create and modify PowerPoint presentations using python-pptx scripting.

Community
Intermediate