← ClaudeAtlas

design-podcast-coverlisted

Generate a podcast cover artifact — pixel-exact 1500×1500 square HTML canvas (half of Apple Podcasts' 3000×3000 spec for manageable PNG size; export the screenshot at 2× scale via DevTools for actual upload). Bold, legible at app-icon scale (~120×120). Reads ./design/<brand-slug>/DESIGN.md, tokens.css, and components.html. Triggers include "podcast cover for X", "podcast art", "show cover", "/podcast-cover".
slogsdon/skills-design · ★ 2 · Web & Frontend · score 73
Install: claude install-skill slogsdon/skills-design
# Skill: podcast-cover Produces a pixel-exact 1500×1500 square HTML canvas. The defining constraint: the cover must read clearly at 120×120px (typical app-icon scale in Apple Podcasts / Spotify / Pocket Casts). Bias toward fewer words, larger type, higher contrast than other platform skills. Bold typographic treatment, no decoration. ## When to use - User has (or is launching) a podcast and wants cover art - A `DESIGN.md` exists for the brand ## Inputs - **Required:** brand slug, show title (max 4 words for legibility at icon scale) - **Optional:** tagline (max 6 words), wordmark/host name placement ## Output `./design/<brand-slug>/artifacts/podcast-cover-YYYY-MM-DD-<slug>.html` ## Steps ### 1. Verify brand exists ```bash test -f ./design/<brand-slug>/tokens.css ``` If missing, stop and tell the user to run `/design-system <brand-slug>` first. ### 2. Gather the brief Ask in one message: ``` 1. Show title (max 4 words — push back if longer; app-icon legibility is the constraint) 2. Optional tagline / category (max 6 words; will appear small) 3. Optional host name placement (corner mark, footer, or absent) ``` If the user gives 5+ words for the title, push back: "Cover art at 120×120 won't hold more than 4 words legibly. What's the core?" Don't proceed until they agree. ### 3. Pick variation — ARCHITECTURE FIRST Pick ONE. Podcast covers reward boldness: - `single-word` — one massive word fills the canvas. Strongest at icon scale. - `type-only` — short title (2