replit-deck

Generates single-file horizontal-swipe HTML decks in eight Replit Slides gallery themes.

Updated May 20, 2026
One-click install
npx skills add https://github.com/Keimoshi/Silverloft --skill replit-deck-keimoshi
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: replit-deck
Source: https://github.com/Keimoshi/Silverloft/tree/main/open-design-port/skills/replit-deck
Command: npx skills add https://github.com/Keimoshi/Silverloft --skill replit-deck-keimoshi

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve? Creating a visually distinctive HTML presentation deck usually means hand-coding CSS themes and debugging slide navigation inside iframe previews. This Skill produces a complete single-file horizontal-swipe HTML deck using one of eight token-frozen visual themes captured from the replit.com/slides template gallery, with a proven navigation script and enforced theme consistency. ## Core Features & Use Cases - Eight complete visual themes: helix (SaaS board), holm (editorial memo), vance (gallery catalog), bevel (Y2K campaign), world-dark/world-mint (finance reports), atlas (museum chapter), bluehouse (consumer cards) — each a full palette, type, and accent system. - Paste-ready layouts and components: 10 cross-theme slide layouts plus shared primitives (eyebrow, kpi-row, image-grid, meta-bar) copied from reference files into the deck. - Iframe-safe navigation script: keyboard, scroll-snap, and swipe navigation with position persistence, verified against five iframe embedding bugs. - Use Case: A founder asks for a Q1 board update deck in the helix theme; the Skill emits one self-contained index.html with a KPI row, insight slide, and ask slide, ready to open in any modern browser. ## Quick Start Ask the AI to create a Replit Slides style deck for your board update using the helix theme with six slides.

Frequently Asked Questions about replit-deck

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

FAQPage Schema
How do I create an HTML slide deck in Replit Slides style?

Pick one of the eight themes (helix, holm, vance, bevel, world-dark, world-mint, atlas, bluehouse), copy the seed template, set the data-theme attribute on the body, and paste slide layouts from the layouts reference. The result is a single self-contained HTML file with keyboard and swipe navigation.

What themes are available in the replit-deck skill?

Eight themes captured from replit.com/slides: helix for SaaS metrics, holm for editorial memos, vance for gallery catalogs, bevel for Y2K campaigns, world-dark and world-mint for finance reports, atlas for museum-style chapters, and bluehouse for consumer product cards.

Can I mix multiple themes in one HTML deck?

No. Each deck must commit to exactly one theme set on the body data-theme attribute, and per-slide style overrides of theme tokens are forbidden. A P0 checklist grep verifies no slide-level accent or background overrides before the deck is emitted.

Does the deck navigation work inside an iframe preview?

Yes. The bundled navigation script is specifically designed for iframe embedding: it detects the real scroller, binds dual scroll and keydown listeners, auto-focuses the body, avoids scrollIntoView, and persists position in localStorage. It must not be rewritten.

When should I use replit-deck instead of simple-deck?

Use replit-deck when the brief explicitly asks for the Replit Slides gallery aesthetic or names one of its eight themes. Use simple-deck when the deck should match the host project's own design system tokens, since replit-deck does not depend on a DESIGN.md file.

What browsers support the generated HTML decks?

The decks target modern evergreen browsers: Chrome 110+, Safari 16+, and Firefox 115+, plus mobile Safari and Chrome. They rely on CSS scroll-snap, color-mix, custom properties, and text-wrap: balance; IE11 and Safari below 15 are not supported.