skills.rest
az9713
az9713COMMUNITY
Explore all skills by this author →
GitHub

simple-deck

Generate a single-file horizontal-swipe HTML deck from a seed template and paste-ready slide layouts.

Updated May 2, 2026
Search Tags:#presentation#deck#slide-layouts#html-deck#seed-template#iframe-nav
One-click install
npx skills add https://github.com/az9713/open-design-tutorial --skill simple-deck-az9713
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: simple-deck
Source: https://github.com/az9713/open-design-tutorial/tree/main/skills/simple-deck
Command: npx skills add https://github.com/az9713/open-design-tutorial --skill simple-deck-az9713

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

Single-file, horizontal-swipe HTML decks built by copying the seed template and pasting slide layouts from references. Pitch decks, product overviews, and study notes — without needing separate tooling or a magazine aesthetic.

Core Features & Use Cases

  • Single-file deck generated from assets/template.html and paste-ready layouts from references/layouts.md.
  • Supports pitch decks, product overviews, and study materials with a consistent navigation and rhythm.
  • Reusable seed with a proven 5-rule iframe nav script to guarantee deterministic behavior.

Quick Start

Copy assets/template.html to index.html, replace the six :root tokens with your design tokens, and paste slides from references/layouts.md to assemble your deck.

Frequently Asked Questions about simple-deck

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

FAQPage Schema
How do I create a single-file HTML presentation deck without external dependencies?▼

To create a single-file HTML presentation deck, you copy a seed template and paste slide layouts into one self-contained file. This approach generates horizontal-swipe decks for product pitches or study materials without needing separate tooling.

What's the best way to build a horizontal-swipe slide layout for a product pitch?▼

Building a horizontal-swipe slide layout involves pasting pre-defined layouts from a reference file into an HTML seed template. The template enforces a 5-rule iframe navigation script to guarantee deterministic swiping behavior for product pitches.

Do I need any special software to generate a self-contained HTML deck?▼

No special software is required to generate a self-contained HTML deck. You simply copy the provided template HTML file, replace the design tokens, and paste slide layouts to assemble the entire presentation artifact.

Can I customize the theme of a single-file HTML deck?▼

You can customize the theme of a single-file HTML deck by replacing six design tokens in the template's root variables. This enforces a consistent theme rhythm across all pasted slide layouts within the self-contained presentation artifact.

What types of content are suitable for a compact HTML deck?▼

Compact HTML decks are suitable for product pitches, marketing overviews, and study materials. These use cases benefit from a self-contained, shareable artifact that maintains consistent navigation without requiring a magazine aesthetic.

Why does my HTML deck navigation script behave inconsistently?▼

HTML deck navigation behaves inconsistently if the seed template's 5-rule iframe navigation script is modified or bypassed. Using the provided reference scaffolding enforces deterministic behavior and ensures consistent horizontal-swipe navigation.

Related Skills

Explore More Design & Creative Skills→
nexu-ionexu-io
84.7k

simple-deck

Creates portable single-file HTML decks combining seed template and slide layouts.

Official
Intermediate
rp1-runrp1-run
38

markdown-preview

Convert Markdown, plain text, and Mermaid diagrams into self-contained HTML previews.

Official
Intermediate
PiercingXXPiercingXX
1

replit-deck

Generate single-file horizontal-swipe HTML decks with Replit Slides themes.

Community
Intermediate
PiercingXXPiercingXX
1

weekly-update

Create a single-file horizontal-swipe HTML slide deck for weekly team updates.

Community
Basic