infographic-generator
Generate branded infographic specifications from any content or data. Outputs structured layout, copy, data visualization, and color scheme — ready to render as HTML/CSS, Satori, Canva, or any design tool. Use this skill when the user wants an infographic, data visual, social media image, comparison chart, stat card, or says "create an infographic for [content]", "make a visual for my LinkedIn post", "design an image for [topic]", "stat graphic for [data]", "comparison infographic", "branded image", "social media graphic", "infographic for [blog post]", "data visualization", "visual content",
npx skills add Affitor/affiliate-skills --skill infographic-generator --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Infographic Generator Generate complete infographic specifications from any content, data, or topic. Outputs structured layout + all copy + data points + color scheme — ready to render as HTML/CSS, with [Satori](https://github.com/vercel/satori) (server-side), in Canva, Figma, or any design tool. **LinkedIn posts with images get 2-3x more engagement.** This skill turns your content into visual assets without design skills. Inspired by [content-pipeline](https://github.com/Affitor/content-pipeline)'s Satori rendering: AI writes the content → structured spec → rendered as a branded image. ## Stage This skill belongs to Stage S2: Content ## When to Use - After `viral-post-writer` creates a LinkedIn post — add a visual - After `content-research-brief` collects stats — visualize them - When creating comparison content — feature/pricing comparison chart - When sharing data or stats — stat highlight cards - When creating a listicle — visual checklist or numbered list - For any social media post that would benefit from a branded image ## Input Schema ```yaml content: string # (required) Content to visualize — post text, data, or article infographic_type: string # (optional, default: auto
- Stage
- When to Use
- Input Schema
- Workflow
- Step 1: Analyze Content and Select Type
- Step 2: Extract Visual Data
- Step 3: Design Layout
- Step 4: Generate Color Scheme
- Step 5: Generate All Copy
- Step 6: Output
- Step 7: Self-Validation
- Output Format
- Error Handling
- Examples
What does the infographic-generator skill do?
Generate branded infographic specifications from any content or data. Outputs structured layout, copy, data visualization, and color scheme — ready to render as HTML/CSS, Satori, Canva, or any design tool. Use this skill when the user wants an infographic, data visual, social media image, comparison chart, stat card, or says "create an infographic for [content]", "make a visual for my LinkedIn post", "design an image for [topic]", "stat graphic for [data]", "comparison infographic", "branded image", "social media graphic", "infographic for [blog post]", "data visualization", "visual content",
How do I install it?
Run `npx skills add Affitor/affiliate-skills --skill infographic-generator --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From Affitor/affiliate-skills, a repository with 586 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.