mashharuki

infographic-generator

mashharuki/claude-code-sample/.claude/skills/infographic-generator/SKILL.md

Turn raw content — stats, a process, a timeline, a concept, research notes, an article, a report — into a single self-contained HTML infographic that is clean, accurate, and presentation-ready (viewable in a browser and exportable to PNG/PDF or a Claude Artifact). Use this skill whenever the user asks for an "インフォグラフィック" / "infographic", a "図解" / visual explainer, a one-pager or "1枚もの", a visual summary of data or a document, a "まとめ画像" for slides or social media, or wants to "見える化 / ビジュアル化 / 図解して" some information — even if they don't say the word "infographic". Prefer this over ad-hoc HTML or image generation because code output keeps every number exact, stays editable ("make the font bigger", "swap the accent color"), and exports losslessly. Not for multi-slide decks (use a slides skill), editable diagrams / flowcharts as source-of-truth (use a drawio skill), or dashboards wired to live data.