screenshot-htmllisted

# Skill: screenshot-html Targeted artifact-node screenshots via headless Chromium. Skips browser chrome and page background — captures just the design canvas. ## When to use - After running any `design-*` skill that produces artifact HTML (LinkedIn post, Instagram card, YouTube thumbnail, Twitter card, blog hero, podcast cover, quote card, carousel, business card, speaker bio, Twitch panels, OBS scene pack, stream overlay, newsletter header, OG/hero pair, talk slides, etc.) and you want PNG exports of each artifact. - When you need a clean image asset to attach to a post, deck, or PR — without the surrounding page padding the artifact HTML uses for preview backdrop. Skip if: - The HTML is a deliverable page (e.g. `design-landing-page`, `design-link-in-bio`) — the page IS the artifact, not a `.canvas` inside it. Use `--full-page` for those. - The user wants browser-rendered review (open in a browser instead). ## What it targets The script queries for these conventions used by `design-*` skills: - `.canvas` — the primary fixed-size artifact wrapper (most skills). - `[class*="canvas-"]` — modifier variants: `canvas-front` / `canvas-back` (business card), `canvas-main` / `canvas-compact` (speaker bio), `canvas-full` / `canvas-safe` (YouTube channel art), `canvas-og` / `canvas-hero` (blog hero), `canvas-square` / `canvas-story` (quote card), `canvas-offline` (Twitch offline banner), `canvas-panel` (Twitch info panels). - `.scene` — hash-routed scenes inside stream-overlay