skills.rest
martiraste-lgtm
martiraste-lgtmCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

infographic-creator

Transform raw text into structured infographic output with React artifacts and external prompts.

Updated Apr 8, 2026
Search Tags:#marketing#react#tailwind#prompts#infographic#visual-design#content-creation
One-click install
npx skills add https://github.com/martiraste-lgtm/claude-skills --skill infographic-creator-martiraste-lgtm
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: infographic-creator
Source: https://github.com/martiraste-lgtm/claude-skills/tree/main/infographic-creator
Command: npx skills add https://github.com/martiraste-lgtm/claude-skills --skill infographic-creator-martiraste-lgtm

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets (resource) components.

What problem does it solve?

The Skill transforms raw text, notes and ideas into polished infographics and detailed prompts for external AI tools, reducing design time and ensuring consistent visuals.

Core Features & Use Cases

  • Dual output: a ready-to-use visual infographic (React/SVG/HTML) plus a detailed external prompt for tools like Gemini, Banana, NotebookLM or Midjourney.
  • Layout-aware extraction: analyzes content, classifies information, and selects appropriate infographic layout from a library of 18 layouts.
  • Step-by-step structured output: generates concise labels, short descriptions, groupings, and visual relationships suitable for high-density visuals.
  • Output artifacts and prompts: provides a React/JSX artifact and a precise prompt suitable for external AI tools to reproduce the infographic.
  • Brand-ready: guidance aligned with a brand system (colors, typography) for coherent visuals.

Quick Start

Provide the content to transform (text or notes) and this unit will generate a complete infographic with a React artifact and an external prompt.

Frequently Asked Questions about infographic-creator

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

FAQPage Schema
How do I convert text into a visual infographic for marketing content?▼

To convert text into a visual infographic, this tool analyzes raw notes, classifies the content, and maps it to one of 18 layout types. It outputs a ready-to-use React artifact alongside a detailed prompt for external design generation.

Can I generate infographics using React and Tailwind from plain text notes?▼

Yes, you can generate infographics using React and Tailwind from plain text. The tool parses your content and produces a structured React/SVG/HTML artifact, ensuring the visual output is ready for web integration and formatted for high-density display.

What is the best way to create AI prompts for Midjourney or Gemini infographics?▼

The best way to create AI prompts for tools like Midjourney or Gemini is to use a layout-aware extraction tool. It structures your raw text into concise labels and visual relationships, generating a precise external prompt to reproduce the infographic.

Does this infographic generator apply brand colors and typography automatically?▼

Yes, the infographic generator applies brand colors and typography automatically. It provides brand-ready guidance aligned with your visual system, ensuring the extracted text and generated React artifacts maintain coherent styling.

How to structure raw business strategy notes into a step-by-step visual layout?▼

To structure raw business strategy notes into a visual layout, the tool performs layout-aware extraction to generate concise labels, groupings, and visual relationships. It selects the appropriate format from 18 layouts to represent your strategy step-by-step.

Related Skills

Explore More Design & Creative Skills→
hoanghd218hoanghd218
7

brand-guidelines

Apply Anthropic brand colors, typography, and layout rules to documents and slides.

Community
Intermediate
jhlee0409jhlee0409

prompt-strategy

Develop and optimize AI prompt strategies for code generation across multiple models.

Community
Advanced
boshi-xixixiboshi-xixixi
6

artifacts-builder

Create multi-component HTML artifacts with React, Tailwind CSS, and shadcn/ui.

Community
Advanced
XinAlohaXinAloha
3

baoyu-xhs-images

Generate multi-page infographic image card series for social media platforms.

Community
Advanced