hps-memphis-pop

Generate 1980s-inspired Memphis-style HTML slide decks for design-focused presentations.

93.2k|10.8k|Updated Apr 28, 2026
One-click install
npx skills add https://github.com/nexu-io/open-design --skill hps-memphis-pop
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: hps-memphis-pop
Source: https://github.com/nexu-io/open-design/tree/main/plugins/_official/examples/hps-memphis-pop
Command: npx skills add https://github.com/nexu-io/open-design --skill hps-memphis-pop

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) components.

What problem does it solve?

This Skill addresses the need for visually distinct, high-impact presentation decks that break away from standard corporate templates by providing a pre-configured, design-system-locked Memphis aesthetic.

Core Features & Use Cases

  • Locked Visual System: Ensures brand consistency with a strict token sheet covering typography, color palettes, and geometric decor devices.
  • Interactive Runtime: Includes a built-in keyboard-navigable HTML runtime with slide transitions and speaker notes.
  • Use Case: Ideal for design community talks, creative pitches, or personal storytelling where the visual language needs to evoke 1980s pop culture, neon grids, and pixel-art aesthetics.

Quick Start

Use the hps-memphis-pop skill to generate a 10-page design history deck about 1980s interface evolution.

Frequently Asked Questions about hps-memphis-pop

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

FAQPage Schema
How do I create a new presentation with this skill?

Copy the provided example.html file and replace the slide content while keeping the style blocks and script tags intact. The deck uses a horizontal scroll-snap layout that automatically handles your content.

Can I change the colors or fonts in the deck?

No, the visual system is locked to ensure consistency. You must use the predefined CSS variables in the :root block and the specified Google Fonts to maintain the Memphis-pop aesthetic.

How do I add speaker notes to my slides?

Add a div element with the class 'notes' inside each section element of your slide. These notes are hidden from the audience but remain available for the presenter.

Does this deck require external JavaScript libraries?

No, the deck is self-contained and uses a lightweight, custom JavaScript runtime for navigation and hash routing. It does not rely on external frameworks like Chart.js or React.