Agent skill · design visual · nexu-io
hps-retro-tv
A family history told through five decades of home movies — the opening question, the eras, and what the footage reveals. Built as a decision-grade story deck for family, close friends.
Why this skill is useful
Provides a structured template and design system for creating family history presentations that the AI wouldn't generate on its own.
What it needs
About 5k tokens when loaded. Last updated 2026-08-07. 84,236 stars on the source repository.
What this skill does
Retro TV（复古显像管） A locked single-theme deck plugin: the retro-tv skin from the upstream MIT-licensed lewislulu/html-ppt-skill (36 themes × 31 layouts), shipped as one self-contained seed — example.html — that carries the full token sheet, the broadcast decor devices, the slide scaffold, and the keyboard runtime. Start from example.html. Replace content only. Never rewrite the design system or the runtime script. Never introduce colors or fonts outside this spec. Positioning vs. sibling retro-skeuomorphic plugins: this is the light warm-cream picture-tube device — scanlines on a cream canvas, not on a black screen. retro-windows is Win95 grey window chrome (title bars, bevels); hermes is dark-background green-phosphor terminal CRT. The three device systems are mutually exclusive — no dark backgrounds, no terminal language, no window chrome here. Do not mix. Locked token sheet (do not deviate) Every variable below is defined in the seed's :root. Slides reference tokens only — never hard-code a color in slide markup. Shadows are always the chunky tube pair — a hard 0 Npx 0 offset plus a soft warm blur together. Never a plain flat or pure-black shadow. Fonts come from Google Fonts @import only (Playfair Display, Inter, Noto Sans SC, JetBrains Mono). No other external resource of any kind. Signature decor devices (the broadcast kit) 1. Picture-tube canvas — the body background layers faint horizontal scanlines repeating-linear-gradient(0deg,rgba(80,40,0,.06) 0 2px, transparent 2px 4px) over a curved-glass vignette radial-gradient(ellipse at center,#f7ecd0 0%,#e8d9b0 85%,#c9b888 100%) that darkens toward the edges like a powered-on CRT. Slides stay transparent so it shows through everywhere. Never paint an opaque slide background. 2. Per-slide CRT scanline overlay — .slide::before adds repeating-linear-gradient(0deg,rgba(0,0,0,.035) 0 2px,transparent 2px 4px) at z-index:1; all slide content sits at z-index:2. Every page reads as a broadcast frame. Never remove or dim it. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills nexu-io/hps-retro-tv