generating-infographics

Generate branded infographics from 114 templates using the @antv/infographic library.

32|7|Updated Dec 6, 2025
One-click install
npx skills add https://github.com/camoa/claude-skills --skill generating-infographics
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: generating-infographics
Source: https://github.com/camoa/claude-skills/tree/main/brand-content-design/skills/infographic-generator
Command: npx skills add https://github.com/camoa/claude-skills --skill generating-infographics

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @antv/infographic, jsdom, puppeteer, sharp, @resvg/resvg-js, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the creation of professional, branded infographics, eliminating the need for complex design tools and manual layout.

Core Features & Use Cases

  • Template-based Generation: Choose from 114+ templates across 7 categories (Sequence, List, Hierarchy, Compare, Quadrant, Relation, Chart).
  • Brand Consistency: Apply custom themes and backgrounds for a cohesive brand look.
  • Data Visualization: Quickly turn data into visually appealing process diagrams, timelines, comparisons, and more.
  • Use Case: Generate a timeline infographic for a project roadmap, a comparison infographic for feature benefits, or a process diagram for a workflow.

Quick Start

Use the infographic skill to generate a new infographic based on the 'process-timeline' template.

Frequently Asked Questions about generating-infographics

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate branded infographics from data using Node.js?

You can generate branded infographics by running the @antv/infographic library within a Node.js environment to apply custom themes and render structured data into visual templates.

What's the best way to create a timeline or process diagram without design tools?

Using a template-based generation approach is the best way to create timelines or process diagrams, allowing you to instantly visualize workflows from over 114 pre-structured infographic templates across 7 categories.

Do I need Puppeteer and jsdom installed to render infographic templates?

Yes, you need Puppeteer, jsdom, and specific rendering dependencies installed in your Node.js environment to properly render the @antv/infographic templates and export them into image formats.

Can I export generated infographics as SVG and PNG files?

Yes, you can export generated infographics as SVG and PNG files, using rendering libraries like sharp and @resvg/resvg-js to handle the image conversion and output format generation.

What types of infographic templates are available for data visualization?

There are over 114 infographic templates available across 7 categories including Sequence, List, Hierarchy, Compare, Quadrant, Relation, and Chart, supporting text-only, icon-based, and illustrated data visualization layouts.

How do I apply a custom brand theme to an infographic?

You apply a custom brand theme to an infographic by configuring custom themes and backgrounds within the template generation parameters, ensuring a cohesive brand look across your visual data outputs.