skills.rest
lumincui
lumincuiCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

infographic

Generate SVG infographics from descriptive input using six layout types.

Updated Mar 5, 2026
Search Tags:#flowchart#visualization#svg#diagram#infographic
One-click install
npx skills add https://github.com/lumincui/skills --skill infographic-lumincui
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: infographic
Source: https://github.com/lumincui/skills/tree/main/infographic
Command: npx skills add https://github.com/lumincui/skills --skill infographic-lumincui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The infographic skill translates complex ideas and data into clear SVG-based information graphics, including flowcharts, architecture diagrams, and process visuals, helping teams communicate concepts quickly and accurately.

Core Features & Use Cases

  • Generate layered-flow, column-layer, swimlane, pattern-grid, side-by-side, and nested-layer SVG diagrams from descriptive input.
  • Apply predetermined visual styles and colors to ensure consistent branding across diagrams.
  • Use cases include system diagrams, process flows, data visualizations, and architectural sketches for documentation or presentations.

Quick Start

Describe the diagram you want (type, content, and style) and this skill will generate a ready-to-use SVG infographic.

Frequently Asked Questions about infographic

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

FAQPage Schema
How do I generate an SVG flowchart from text descriptions?▼

To generate an SVG flowchart from text, describe the diagram type, content, and style. The infographic skill transforms descriptive input into clear SVG-based diagrams without extra narration, rendering layered-flow, column-layer, or swimlane layouts.

What types of SVG diagrams can I create for system architecture visualization?▼

For system architecture visualization, you can create layered-flow, column-layer, swimlane, pattern-grid, side-by-side, and nested-layer SVG diagrams. These visual formats help teams communicate structural concepts quickly and accurately.

Can I use this to create swimlane diagrams for process flows?▼

Yes, you can create swimlane diagrams for process flows. You provide descriptive input detailing the process steps and style, and the skill renders the output as a single ready-to-use SVG payload.

Do I need to specify visual styles to generate consistent data visualizations?▼

You do not need to specify detailed visual styles manually to generate consistent data visualizations. The skill applies predetermined visual styles and colors to ensure consistent branding across all generated SVG diagrams automatically.

What is the best way to convert complex ideas into crisp SVG infographics?▼

The best way to convert complex ideas into crisp SVG infographics is to provide a descriptive input of your concept. The skill selects an appropriate layout type and style, outputting a single SVG payload without extra narration.

Related Skills

Explore More Design & Creative Skills→
yt3treesyt3trees

mermaid-diagram

Generate Mermaid diagrams with Japanese text handling from structured prompts.

Community
Basic
sandecosandeco
158

mira-qrcode

Generate a QR code SVG from user-provided text or links for Mira slides.

Community
Advanced
davpatel605-beepdavpatel605-beep

concept-diagrams

Generate standalone HTML SVG diagrams with flat minimal styling.

Community
Advanced
vuminhieuvuminhieu

mermaidjs-v11

Render Mermaid.js v11 diagrams to SVG, PNG, or PDF via CLI.

Community
Intermediate