skills.rest
Mjlike123
Mjlike123COMMUNITY
Explore all skills by this author →
GitHub

make-a-deck

Creates single-file HTML slide decks with letterboxed scaling and keyboard navigation.

Updated Aug 13, 2026
Search Tags:#html#layout#presentation#slides#deprecated#deck#speaker notes
One-click install
npx skills add https://github.com/Mjlike123/ui-prototype-workbench --skill make-a-deck-mjlike123
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: make-a-deck
Source: https://github.com/Mjlike123/ui-prototype-workbench/tree/main/.agents/skills/monkren-design/skills/_deprecated/make-a-deck
Command: npx skills add https://github.com/Mjlike123/ui-prototype-workbench --skill make-a-deck-mjlike123

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? This Skill builds presentation decks as a single self-contained HTML file, avoiding manual slide layout work and viewport scaling issues. Note: it is deprecated since v5.0 and scheduled for removal; Slidev or reveal.js are recommended alternatives. ## Core Features & Use Cases - Six-phase workflow: Covers discovery, layout system planning, deck shell setup, per-slide building, optional speaker notes, and final verification. - Fixed-canvas scaling: Renders 1920x1080 slides that letterbox-fit any viewport, with keyboard/click navigation, slide counting, localStorage persistence, and PDF printing via a deck-shell starter component. - Use Case: Given a PRD, produce a 10-slide engineering all-hands deck with a consistent layout system, 24px+ body text, and WCAG-checked contrast, delivered as one HTML file. ## Quick Start Ask the agent to create an HTML slide deck from your PRD or outline, specifying the audience, slide count, and tone.

Frequently Asked Questions about make-a-deck

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

FAQPage Schema
How do I create an HTML slide deck from a PRD?▼

Provide the PRD and specify audience, slide count, and tone. The skill reads the source material, defines a layout system of 4-6 slide types, then builds each slide as a section inside a deck-shell component that handles scaling and navigation.

What tool should I use for HTML presentations instead of this skill?▼

This skill is deprecated since v5.0. The documentation recommends Slidev or reveal.js for building HTML slide decks, and suggests using a separate review skill if you only need to evaluate an existing deck.

Does the HTML deck support keyboard navigation and PDF export?▼

Yes. The deck-shell starter component provides arrow-key and space navigation, click advancing, slide counting, localStorage persistence, and print-to-PDF support out of the box.

Why is the make-a-deck skill deprecated?▼

It was deprecated in v5.0 because general-purpose creation tools like Bolt, v0, and Cursor outperform it in the creation domain. It will be physically deleted after six months if no users remain.

What are the typography and layout constraints for slides?▼

Slides use a 1920x1080 canvas with body text at 24px minimum (ideally 32px+) and headlines at 60-96px. A deck is limited to 1-2 background colors, with section dividers allowed one exception.

Related Skills

Explore More Design & Creative Skills→
HayatelinHayatelin
3

design-taste-frontend

Infer design intent before generating frontend interfaces for landing pages and portfolios.

Community
Advanced
hiyeshuhiyeshu
205

codeck-export

Export HTML presentation decks to PDF and PPTX with automated quality checks.

Community
Advanced
CANTAGESTUDIOCANTAGESTUDIO
3

accessibility-contrast-audit

Audit UI color contrast and accessibility metrics against WCAG guidelines.

Community
Intermediate
tomwangowatomwangowa
1

interactive-presentation-generator

Generate interactive presentations in reveal.js HTML, Marp, or Slidev formats.

Community
Advanced