slides

Generate data-driven HTML slide decks with Chart.js visuals and design tokens.

Updated Feb 20, 2026
One-click install
npx skills add https://github.com/saajunaid/junai --skill slides-saajunaid
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: slides
Source: https://github.com/saajunaid/junai/tree/main/.github/skills/frontend/slides
Command: npx skills add https://github.com/saajunaid/junai --skill slides-saajunaid

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Creating strategic, data-driven HTML slide decks that integrate charts (Chart.js), design tokens, responsive layouts, and copywriting formulas can be time-consuming and error-prone without a cohesive framework.

Core Features & Use Cases

  • Chart.js integration for interactive data visuals in presentation slides.
  • Design tokens to ensure consistent typography, color, and spacing.
  • Responsive, accessible slide layouts that adapt to desktop and mobile.
  • Copywriting formulas and contextual slide strategies to optimize messaging.
  • Use Case: marketing decks that present data clearly, product updates with visuals, and investor pitches with strong narrative.

Quick Start

Generate a data-driven HTML slide deck from a provided dataset and a concise narrative.

Frequently Asked Questions about slides

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

FAQPage Schema
How do I create data-driven HTML presentation slides with Chart.js visuals?

Create data-driven HTML presentation slides by applying design tokens for consistent UI and integrating Chart.js for interactive data visuals. This enforces responsive layouts and polished copywriting formulas for marketing decks, product updates, and investor pitches.

What is the best way to build responsive HTML slide decks for marketing presentations?

Building responsive HTML slide decks for marketing presentations is best handled by applying design tokens for typography and spacing alongside contextual slide strategies. This approach ensures accessible layouts that adapt across desktop and mobile while optimizing messaging.

Does this approach support design tokens for consistent presentation layouts?

Yes, design tokens are fully supported to ensure consistent typography, color, and spacing across presentation layouts. This token-driven UI framework maintains visual coherence while enabling rapid, repeatable production of strategy decks.

Can I use Chart.js to embed interactive data visuals in my slide decks?

Yes, you can use Chart.js to embed interactive data visuals directly into your HTML slide decks. This integration allows you to present data clearly in data-dense pitches and strategy decks that require responsive layouts.

What do I need to generate a data-dense pitch deck with HTML slides?

To generate a data-dense pitch deck with HTML slides, you need a provided dataset and a concise narrative. The framework applies copywriting formulas and chart integration to produce polished, responsive presentations rapidly.