red-hat-quick-deck

Solid

Create beautiful, shareable HTML-based slide presentations styled to Red Hat brand standards. Generates single-file, self-contained HTML decks with click/keyboard navigation, story-arc-driven narrative structure, and cinematic dark-mode aesthetics. Supports embedded videos (YouTube, Vimeo, direct URLs) and linked media (memes, GIFs, images) with brand-consistent styling. Use this skill whenever the user wants to create a slide deck, presentation, quick deck, quick slides, pitch deck, talk, or briefing that should follow Red Hat branding. Also trigger when the user mentions "quick deck", "quick slides", "HTML slides", "shareable deck", "presentation for [audience]", "talk about [topic]", or asks to present technical content in Red Hat style. This skill is specifically for HTML output — if the user explicitly asks for .pptx, use the pptx skill instead, but suggest this skill as an alternative for easy sharing.

Web & Frontend 33 stars 8 forks Updated 3 weeks ago MIT

Install

View on GitHub

Quality Score: 71/100

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

Skill Content

# Red Hat Quick Deck Generate stunning, self-contained HTML presentations that follow Red Hat brand standards and use narrative story arcs to make technical content compelling and memorable. ## Before You Begin 1. **Read the brand reference**: `references/redhat-brand.md` — contains the full color palette, typography, and design rules. 2. **Read the story arc guide**: `references/story-arcs.md` — contains narrative structures and slide design principles. 3. If the `redhat-brand` skill is also installed, consult it for additional brand application guidance. 4. **Ask the user** which mode they prefer for the deck before generating. Use the ask_user_input tool: - Question: "What visual mode should this deck use?" - Options: "Dark mode (cinematic, dark backgrounds — best for screens & presenting)", "Light mode (clean, white backgrounds — best for print & email sharing)" - Default to **Dark mode** if the user doesn't specify or says "either" or "don't care." ## What This Skill Produces A single `.html` file that: - Is completely self-contained (inline CSS, inline JS; Google Fonts, Red Hat Design Tokens, and optionally Red Hat Icons loaded via CDN) - Can be opened in any browser, emailed, or hosted on any web server - Has keyboard navigation (arrow keys, spacebar) and click navigation - Has a slide counter / progress indicator - Looks cinematic and professional on screen, projector, or shared link - Follows a deliberate story arc that builds a persuasive narrative - I...

Details

Author
toddward
Repository
toddward/red-hat-quick-deck
Created
2 months ago
Last Updated
3 weeks ago
Language
N/A
License
MIT

Similar Skills

Semantically similar based on skill content — not just same category

Code & Development Solid

create-slidedeck

Turn any reference material into a polished, visually cohesive slide deck.

40 Updated 3 days ago
zocomputer
Web & Frontend Solid

codeck-design

Designer role. Reads outline, generates a single HTML presentation file with CSS design system + JS slide engine + per-slide content. Accepts visual references (URLs, screenshots, design specs) and extracts design signals to inform the isomorphic mapping. Use whenever the user says "design slides", "generate deck", "generate the deck", "build slides", "visual style", "reference this style", "like this design", "design", "generate slides", "visual style", "reference this style", or wants to turn an outline into actual slides.

208 Updated 2 weeks ago
hiyeshu
Data & Documents Solid

codeck-export

Publisher role. Exports deck to PDF or PPTX with post-export QA. Use whenever the user says "export", "to PDF", "to PPTX", "PowerPoint", "print", "download", "save as PDF", "convert", or wants to convert a finished deck to PDF or PPTX.

208 Updated 2 weeks ago
hiyeshu
Web & Frontend Solid

frontend-design

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

1,041 Updated 3 days ago
dtsola
Code & Development Solid

editorial-card-screenshot

Generate high-density editorial HTML info cards in a modern magazine and Swiss-international style, then capture them as ratio-specific screenshots. Use when the user provides text or core information and wants: (1) a complete responsive HTML info card, (2) the design to follow the stored editorial prompt, (3) output in fixed visual ratios such as 3:4, 4:3, 1:1, 16:9, 9:16, 2.35:1, 3:1, or 5:2, or (4) both HTML and a rendered PNG cover/card from the same content.

410 Updated 1 months ago
shaom