deck-html

Solid

Build autonomous HTML slides (16:9) from a presentation JSON spec produced by deck-outline: pick a theme + palette, then build_html.py copies templates/slides.html, injects the palette into :root CSS variables and replaces the layout blocks. Mandatory verification gate: verify_slides.py in real Chromium (Playwright) — overflow/text-clipping/layout/NAV checks, exit 0/1 — plus a visual pass and the product-designer review checklist. Triggers: 'сделай слайды', 'слайды html', 'презентация html', 'html slides', '16:9 слайды', 'собрать слайды', 'build slides', 'сверстать презе��тацию'.

AI & Automation 5 stars 0 forks Updated today MIT

Install

View on GitHub

Quality Score: 83/100

Stars 20%
26
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# Deck HTML — slides.html from a JSON spec Use this skill to **build self-contained HTML slides (16:9)** from the JSON spec that `deck-outline` produces. Autonomous output: all CSS inlined, zero external links, opens in any browser, arrow/keyboard/touch navigation. ## When to use - User asks for "слайды", "html slides", "16:9", "сверстать презентацию". - The outline/spec exists and a browser-deliverable is needed. ## Do NOT use - To build slide STRUCTURE — that is `deck-outline`. - To build the .pptx — that is `deck-pptx`. ## Step 3 — Theme and palette Themes (each = a layout set + type system). Pick one; `general`/`modern` when unspecified: | Theme | Character | |---|---| | `general` | minimal, clean, airy | | `modern` | flat cards, large radii | | `executive` | strict, business, dark | | `momentum` | dynamic, accented | | `swift` | Apple-style, airy, teal | | `standard` | basic, universal | Extract the palette (`ThemeData` keys) and write it into the spec so html and pptx use the SAME palette: ``` primary / background / card / stroke / background_text / primary_text / graph_0..graph_4 (up to 5 series) ``` Light theme recommendation: `background: #FFFFFF`, `primary: #007AFF` (or the theme's accent), dark text `primary_text: #1C1C1E`. Dark theme: `background: #1C1C1E`, light text. ## Build ```bash python3 scripts/build_html.py deck.json slides.html ``` The builder copies `templates/slides.html`, replaces the slides with the real content, fills the `:root` CSS v...

Details

Author
bestdeejay-design
Repository
bestdeejay-design/agent-skills
Created
1 months ago
Last Updated
today
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

Data & Documents Listed

html-deck

Generate self-contained, single-file HTML presentation decks — no framework, no build step, no dependencies beyond Google Fonts. Use this skill whenever the user wants to create slides, a slide deck, a talk, a presentation, or a "deck" that should be an HTML file (not PowerPoint/PPTX, not Google Slides, not a terminal/Markdown tool like presenterm). Especially use it for technical talks, conference/meetup presentations, video-series intros, or any time the user wants code-authored, version-controllable slides with a dark, editorial design. Also trigger when the user references this house style, asks for "a deck like Tonbi's", or wants to convert an outline/notes into presentable slides. Default to this skill for HTML decks even if the user doesn't say "HTML" explicitly, as long as they don't ask for PPTX or a WYSIWYG tool.

1 Updated yesterday
alycda
Web & Frontend Listed

deck-to-html

Convert a PDF or PowerPoint deck into a single self-contained interactive HTML presentation — native animated SVG charts, sequenced entrance animations, live-embedded demos, keyboard navigation, and a PDF export path. Use whenever someone wants a deck turned into HTML, an "interactive"/"animated"/"web" version of slides, a pptx/pdf converted to a web deck, or asks to rebuild charts from a deck natively. Triggers on "PPT를 HTML로", "덱을 HTML로", "interactive slides", "html deck", "pptx to html", "pdf to html slides", "animated slide deck".

2 Updated 2 weeks ago
hunkim
AI & Automation Featured

make-a-deck

Slide presentation in HTML

64,796 Updated yesterday
asgeirtj