Agent skill

Layout and Style Infographic Maker

by JimLiu in JimLiu/baoyu-skills

Generates infographics from your content by pairing one of 21 layout types with one of 22 visual styles, after analyzing the material and recommending combinations.

MITAuto-check passedMedia & Creative

Install Layout and Style Infographic Maker

skills CLI
$ npx skills add JimLiu/baoyu-skills --skill baoyu-infographic -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install JimLiu/baoyu-skills baoyu-infographic --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/JimLiu/baoyu-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/baoyu-infographic .claude/skills/baoyu-infographic && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
baoyu-infographic
GitHub stars
27k
Used in
1 other repo
Token cost
~4.9k tokens
SKILL.md length
2,224 words
Files
51 (incl. references)
Skills in repo
22
Repo updated
First seen
Licence
MIT

At a glance

Generates infographics from your content by pairing one of 21 layout types with one of 22 visual styles, after analyzing the material and recommending combinations.

  • Works in 7 steps: Setup & Analyze → Generate Structured Content →… → Recommend Combinations → …
  • Turning an article or report into a visual summary
  • SKILL.md covers User Input Tools, Image Generation Tools, Reference Images and Confirmation Policy, plus 10 more sections
  • Calls codex

What it does

Two choices define an infographic here: the layout, which is the information structure, and the style, which is the visual look, and any layout can be paired with any style. The skill offers 21 layouts and 22 styles, analyzes your content, recommends layout and style pairings, and then generates the finished image.

The layouts folder includes files for bento grid, binary comparison, bridge, circular flow, comic strip, comparison matrix, dashboard, dense modules, funnel, hierarchical layers, hub and spoke, and iceberg, among others. An analysis framework and a base prompt guide the choice and the image prompt, and a preferences schema covers first-time setup.

Rendering goes to a backend chosen in order: one named in the request, a saved EXTEND.md preference, then automatic selection that uses Codex's imagegen skill when it is listed and otherwise the codex CLI through baoyu-image-gen. Questions to you use the runtime's built-in question tool or a numbered plain-text list.

When your agent uses it

  • Turning an article or report into a visual summary
  • Comparing options with a matrix, funnel or hub-and-spoke layout
  • Trying several layout and style pairings for the same content

Example prompts

  • “Make an infographic summarizing our Q3 customer survey results.”
  • “Turn this onboarding process into a funnel layout infographic in a clean style.”
  • “Create a high-density information graphic comparing three project management tools.”

Requirements

  • An image rendering backend available to the agent

Workflow steps

7 steps, taken from the step headings in SKILL.md.

  1. Setup & Analyze
  2. Generate Structured Content → structured-content.md
  3. Recommend Combinations
  4. Confirm Options
  5. Generate Prompt → prompts/infographic.md
  6. Generate Image
  7. Output Summary

What it can do on your machine

Read from SKILL.md and the folder at commit 1567581. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • codex

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Layout and Style Infographic Maker loads about 4.9k tokens when it runs, and up to ~24k if it reads all its reference files. Until then it costs about 72 tokens; SKILL.md has 2,224 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~72
When it runs · the whole SKILL.md, loaded when a task matches
~4.9k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~24k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from JimLiu/baoyu-skills at commit 1567581, republished under its MIT licence (© JimLiu). 2,224 words, ~4,935 tokens.

Download SKILL.mdSave it as .claude/skills/baoyu-infographic/SKILL.md (or your agent's skills folder). This skill also uses 50 other files; get the full folder from GitHub.
name
baoyu-infographic
description
Generate professional infographics with 21 layout types and 22 visual styles. Analyzes content, recommends layout×style combinations, and generates publication-ready infographics. Use when user asks to create "infographic", "信息图", "visual summary", "可视化", or "高密度信息大图".
version
1.117.4

Infographic Generator

Two dimensions: layout (information structure) × style (visual aesthetics). Freely combine any layout with any style.

User Input Tools

When this skill prompts the user, follow this tool-selection rule (priority order):

  1. Prefer built-in user-input tools exposed by the current agent runtime — e.g., AskUserQuestion, request_user_input, clarify, ask_user, or any equivalent.
  2. Fallback: if no such tool exists, emit a numbered plain-text message and ask the user to reply with the chosen number/answer for each question.
  3. Batching: if the tool supports multiple questions per call, combine all applicable questions into a single call; if only single-question, ask them one at a time in priority order.

Concrete AskUserQuestion references below are examples — substitute the local equivalent in other runtimes.

Image Generation Tools

When this skill needs to render an image, resolve the backend in this order:

  1. Current-request override — if the user names a specific backend in the current message, use it.
  2. Saved preference — if EXTEND.md sets preferred_image_backend to a backend available right now, use it.
  3. Auto-select (when the preference is auto, unset, or the pinned backend isn't available):
    • Codex (imagegen) — first, inspect your available-skills / tool inventory. If a skill named imagegen is listed, you are running inside Codex and MUST use it: invoke via the Skill tool with skill: "imagegen", passing the saved prompt file's content (plus output path and aspect ratio per Codex imagegen's own args). Codex imagegen is the official raster backend in that runtime and outranks any non-native skill (e.g., baoyu-image-gen) unless the user has explicitly pinned a different preferred_image_backend.
    • Codex via codex exec (codex-imagegen) — if the current runtime exposes no native imagegen skill but the codex CLI is on PATH with an active codex login, route through baoyu-image-gen --provider codex-cli (preferred), or — if baoyu-image-gen is unavailable — invoke the bundled wrapper directly. Details, parameters, and the runtime-discovery procedure live in references/codex-imagegen.md — load that file only when this branch is selected.
    • Cursor (GenerateImage) — if the runtime exposes a native GenerateImage tool, you are running inside Cursor and it outranks any non-native skill the same way Codex imagegen does. Two hard caveats: (a) it has no aspect-ratio parameter — state the target aspect ratio / dimensions explicitly in the prompt text passed as description; (b) it does not accept an output directory — it saves to a tool-managed location, so after generation copy/move the file to the skill's expected output path (e.g., outputs/.../NN-xxx.png). Reference images go in reference_image_paths.
    • Other runtime-native tools — if the runtime exposes a different native image tool (e.g., Hermes image_generate), use it the same way.
    • Otherwise, if exactly one non-native backend is installed (e.g., baoyu-image-gen), use it.
    • Otherwise (multiple non-native backends with no runtime-native tool), ask the user once — batch with any other initial questions.
  4. If none are available, tell the user and ask how to proceed.

⛔ Never substitute SVG, HTML, canvas, or other code-based rendering for raster image generation. Codex imagegen's own description says it should be used "when the output should be a bitmap asset rather than repo-native code or vector." If you cannot resolve a raster backend via step 3, fall through to step 4 and ask the user — do not silently emit SVG, write inline <svg> markup, or produce HTML/CSS art as a substitute. This applies even if the article/section seems "diagram-like": the consumer skill calling this rule has already decided that a raster image is what it needs.

⛔ Never repair rendered text by painting over a generated bitmap. Do not use ImageMagick, Pillow, Canvas, SVG, HTML/CSS, OCR scripts, or any other programmatic overlay to cover, rewrite, erase, stroke, or replace labels, headings, callouts, data values, or any other text inside an already generated infographic. If text is wrong or unclear, regenerate from a corrected prompt, switch to a layout with less on-image text, or ask the user which imperfect candidate to keep.

Setting preferred_image_backend: ask forces the step-3 prompt every run regardless of available backends. Users change the pinned backend via the ## Changing Preferences section below.

Prompt file requirement (hard): write each image's full, final prompt to a standalone file under prompts/ (naming: NN-{type}-[slug].md) BEFORE invoking any backend. The backend receives the prompt file (or its content); the file is the reproducibility record and lets you switch backends without regenerating prompts.

Concrete tool names (imagegen, GenerateImage, image_generate, baoyu-image-gen) above are examples — substitute the local equivalents under the same rule.

Reference Images

Users may supply reference images to guide style, palette, composition, or subject.

Intake: Accept via --ref <files...> or when the user provides file paths / pastes images in conversation.

  • File path(s) → copy to refs/NN-ref-{slug}.{ext} alongside the output
  • Pasted image with no path → ask the user for the path (per the User Input Tools rule above), or extract style traits verbally as a text fallback
  • No reference → skip this section

Usage modes (per reference):

UsageEffect
directPass the file to the backend as a reference image
styleExtract style traits (line treatment, texture, mood) and append to the prompt body
paletteExtract hex colors from the image and append to the prompt body

Record in prompts/infographic.md frontmatter when refs exist:

yaml
references:
  - ref_id: 01
    filename: 01-ref-brand.png
    usage: direct

At generation time:

  • Verify each referenced file exists on disk
  • If usage: direct AND the chosen backend accepts reference images (e.g., baoyu-image-gen via --ref) → pass the file via the backend's ref parameter
  • Otherwise → embed extracted style/palette traits in the prompt text

Confirmation Policy

Default behavior: confirm before generation.

  • Treat explicit skill invocation, a file path, a matched keyword shortcut, EXTEND.md defaults, and the documented default combination as recommendation inputs only. None of them authorizes skipping confirmation.
  • Do not start Step 5 or Step 6 until the user confirms the combination/aspect/language/backend choices.
  • Skip confirmation only when the current request explicitly says to do so, for example: --no-confirm, "直接生成", "不用确认", "跳过确认", "按默认出图", or equivalent wording.
  • If confirmation is skipped explicitly, state the assumed combination/aspect/language/backend in the next user-facing update before generating.

Options

OptionValues
--layout21 options (see Layout Gallery), default: bento-grid
--style22 options (see Style Gallery), default: craft-handmade
--aspectNamed: landscape (16:9), portrait (9:16), square (1:1). Custom: any W:H ratio (e.g., 3:4, 4:3, 2.35:1)
--langen, zh, ja, etc.
--no-confirmSkip Step 4 only when the user explicitly requests direct generation without confirmation
--ref <files...>Reference images (file paths) for style / palette / composition / subject guidance
LayoutBest For
linear-progressionTimelines, processes, tutorials
binary-comparisonA vs B, before-after, pros-cons
comparison-matrixMulti-factor comparisons
hierarchical-layersPyramids, priority levels
tree-branchingCategories, taxonomies
hub-spokeCentral concept with related items
structural-breakdownExploded views, cross-sections
bento-gridMultiple topics, overview (default)
icebergSurface vs hidden aspects
bridgeProblem-solution
funnelConversion, filtering
isometric-mapSpatial relationships
dashboardMetrics, KPIs
periodic-tableCategorized collections
comic-stripNarratives, sequences
story-mountainPlot structure, tension arcs
jigsawInterconnected parts
venn-diagramOverlapping concepts
winding-roadmapJourney, milestones
circular-flowCycles, recurring processes
dense-modulesHigh-density modules, data-rich guides

Full definitions live at references/layouts/<layout>.md.

StyleDescription
craft-handmadeHand-drawn, paper craft (default)
claymation3D clay figures, stop-motion
kawaiiJapanese cute, pastels
storybook-watercolorSoft painted, whimsical
chalkboardChalk on black board
cyberpunk-neonNeon glow, futuristic
bold-graphicComic style, halftone
aged-academiaVintage science, sepia
corporate-memphisFlat vector, vibrant
technical-schematicBlueprint, engineering
origamiFolded paper, geometric
pixel-artRetro 8-bit
ui-wireframeGrayscale interface mockup
subway-mapTransit diagram
ikea-manualMinimal line art
knollingOrganized flat-lay
lego-brickToy brick construction
pop-laboratoryBlueprint grid, coordinate markers, lab precision
morandi-journalHand-drawn doodle, warm Morandi tones
retro-pop-grid1970s retro pop art, Swiss grid, thick outlines
hand-drawn-eduMacaron pastels, hand-drawn wobble, stick figures
retro-popup-popRetro popup collage, vintage UI, thick outlines, flat pop colors

Full definitions live at references/styles/<style>.md.

Content TypeLayout + Style
Timeline/Historylinear-progression + craft-handmade
Step-by-steplinear-progression + ikea-manual
A vs Bbinary-comparison + corporate-memphis
Hierarchyhierarchical-layers + craft-handmade
Overlapvenn-diagram + craft-handmade
Conversionfunnel + corporate-memphis
Cyclescircular-flow + craft-handmade
Technicalstructural-breakdown + technical-schematic
Metricsdashboard + corporate-memphis
Educationalbento-grid + chalkboard
Journeywinding-roadmap + storybook-watercolor
Categoriesperiodic-table + bold-graphic
Product Guidedense-modules + morandi-journal
Technical Guidedense-modules + pop-laboratory
Trendy Guidedense-modules + retro-pop-grid
Retro Pop Guidedense-modules + retro-popup-pop
Educational Diagramhub-spoke + hand-drawn-edu
Process Tutoriallinear-progression + hand-drawn-edu

Default combination: bento-grid + craft-handmade (fallback recommendation only — per the Confirmation Policy, defaults never bypass Step 4).

Show full SKILL.md (896 more words)Show less

Keyword Shortcuts

When the user's input contains these keywords, use the mapped layout as the leading Step 3 recommendation and promote the listed styles to the top of the Step 3 list. Skip content-based layout inference for matched keywords. Append any Prompt Notes to the Step 5 prompt.

User KeywordLayoutRecommended StylesDefault AspectPrompt Notes
高密度信息大图 / high-density-infodense-modulesmorandi-journal, pop-laboratory, retro-pop-grid, retro-popup-popportrait—
信息图 / infographicbento-gridcraft-handmadelandscapeMinimalist: clean canvas, ample whitespace, no complex background textures. Simple cartoon elements and icons only.

Output Structure

infographic/{topic-slug}/
├── source-{slug}.{ext}
├── analysis.md
├── structured-content.md
├── prompts/infographic.md
└── infographic.png

Slug: 2-4 words kebab-case from topic. Conflict: append -YYYYMMDD-HHMMSS.

Core Principles

  • Preserve source data faithfully—no summarization or rephrasing (but strip any credentials, API keys, tokens, or secrets before including in outputs)
  • Define learning objectives before structuring content
  • Structure for visual communication (headlines, labels, visual elements)

Workflow

Step 1: Setup & Analyze

1.1 Load Preferences (EXTEND.md)

Check EXTEND.md in priority order — the first one found wins:

PriorityPathScope
1.baoyu-skills/baoyu-infographic/EXTEND.mdProject
2${XDG_CONFIG_HOME:-$HOME/.config}/baoyu-skills/baoyu-infographic/EXTEND.mdXDG
3$HOME/.baoyu-skills/baoyu-infographic/EXTEND.mdUser home
ResultAction
FoundRead, parse, display a one-line summary
Not foundAsk the user with AskUserQuestion (see references/config/first-time-setup.md)

EXTEND.md supports: preferred layout/style, default aspect ratio, language preference, preferred image backend, custom style definitions.

Schema: references/config/preferences-schema.md

1.2 Analyze Content → analysis.md

  1. Save source content (file path or paste → source.md)
    • Backup rule: If source.md exists, rename to source-backup-YYYYMMDD-HHMMSS.md
  2. Analyze: topic, data type, complexity, tone, audience
  3. Detect source language and user language
  4. Extract design instructions from user input
  5. Save analysis
    • Backup rule: If analysis.md exists, rename to analysis-backup-YYYYMMDD-HHMMSS.md

See references/analysis-framework.md for detailed format.

Step 2: Generate Structured Content → structured-content.md

Transform content into infographic structure:

  1. Title and learning objectives
  2. Sections with: key concept, content (verbatim), visual element, text labels
  3. Data points (all statistics/quotes copied exactly)
  4. Design instructions from user

Rules: Markdown only. No new information. Preserve data faithfully. Strip any credentials or secrets from output.

See references/structured-content-template.md for detailed format.

Step 3: Recommend Combinations

3.1 Check Keyword Shortcuts first: If user input matches a keyword from the Keyword Shortcuts table, use the associated layout as the leading recommendation and prioritize associated styles as top recommendations. Skip content-based layout inference.

3.2 Otherwise, recommend 3-5 layout×style combinations based on:

  • Data structure → matching layout
  • Content tone → matching style
  • Audience expectations
  • User design instructions
Step 4: Confirm Options

Hard gate: this step is mandatory per the Confirmation Policy — Steps 5–6 cannot start until the user confirms here (or explicitly opts out with --no-confirm / equivalent in the current request).

Ask the user to confirm the questions below following the User Input Tools rule at the top of this file (batch into one call if the runtime supports multiple questions; otherwise ask one at a time in priority order).

PriorityQuestionWhenOptions
1CombinationAlways3+ layout×style combos with rationale
2AspectAlwaysNamed presets (landscape/portrait/square) or custom W:H ratio (e.g., 3:4, 4:3, 2.35:1)
3LanguageOnly if source ≠ user languageLanguage for text content
4Image BackendOnly if step 3 of the ## Image Generation Tools rule needs to ask (no runtime-native tool AND multiple non-native backends, OR preferred_image_backend: ask)Available backends
Step 5: Generate Prompt → prompts/infographic.md

Backup rule: If prompts/infographic.md exists, rename to prompts/infographic-backup-YYYYMMDD-HHMMSS.md

Combine:

  1. Layout definition from references/layouts/<layout>.md
  2. Style definition from references/styles/<style>.md
  3. Base template from references/base-prompt.md
  4. Structured content from Step 2
  5. All text in confirmed language

Aspect ratio resolution for {{ASPECT_RATIO}}:

  • Named presets → ratio string: landscape→16:9, portrait→9:16, square→1:1
  • Custom W:H ratios → use as-is (e.g., 3:4, 4:3, 2.35:1)
Step 6: Generate Image
  1. Resolve the backend per the ## Image Generation Tools rule at the top of this file.
  2. Ensure the full final prompt is persisted at prompts/infographic.md (already written in Step 5) BEFORE invoking the backend — the file is the reproducibility record.
  3. Check for existing file: Before generating, check if infographic.png exists
    • If exists: Rename to infographic-backup-YYYYMMDD-HHMMSS.png
  4. Call the chosen backend with the prompt file and output path.
    • codex-imagegen invocation: when the rule resolves to codex-imagegen, see references/codex-imagegen.md for the invocation contract (preferred baoyu-image-gen --provider codex-cli path, runtime wrapper discovery, parameter notes, stdout schema, batch semantics).
  5. On failure, auto-retry once

Text correction policy:

  • If labels, headings, callouts, data values, or any other rendered text is misspelled, garbled, hard to read, or visually weak, do not patch the bitmap with code.
  • For text-correction regenerations, write a new prompt file and a new output path so the flawed candidate is preserved for comparison.
  • Post-processing is limited to crop, resize, compression, or format conversion that does not alter text or the main composition.
Step 7: Output Summary

Report: topic, layout, style, aspect, language, image backend, output path, files created.

References

  • references/analysis-framework.md - Analysis methodology
  • references/structured-content-template.md - Content format
  • references/base-prompt.md - Prompt template
  • references/layouts/<layout>.md - 21 layout definitions
  • references/styles/<style>.md - 21 style definitions

Changing Preferences

EXTEND.md lives at the first matching path in Step 1.1. Three ways to change it:

  • Edit directly — open EXTEND.md and change fields. Full schema: references/config/preferences-schema.md.
  • Reconfigure interactively — delete EXTEND.md (or ask "reconfigure baoyu-infographic preferences" / "重新配置"). The next run re-triggers first-time setup.
  • Common one-line edits:
    • preferred_image_backend: auto — default; runtime-native tool wins, falls back to the only installed backend, asks only if multiple non-native are present.
    • preferred_image_backend: codex-imagegen — pin to Codex's built-in.
    • preferred_image_backend: baoyu-image-gen — pin to the baoyu-image-gen skill.
    • preferred_image_backend: ask — confirm backend every run.
    • preferred_layout: dense-modules, preferred_style: morandi-journal, preferred_aspect: portrait, language: zh — shift the Step-3 recommendations and Step-4 defaults (per Confirmation Policy, these never bypass Step 4).

© JimLiu, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 50 other files (references) in skills/baoyu-infographic of JimLiu/baoyu-skills.

  • SKILL.md
  • references/analysis-framework.md
  • references/base-prompt.md
  • references/codex-imagegen.md
  • references/config/first-time-setup.md
  • references/config/preferences-schema.md
  • references/layouts/bento-grid.md
  • references/layouts/binary-comparison.md
  • references/layouts/bridge.md
  • references/layouts/circular-flow.md
  • references/layouts/comic-strip.md
  • references/layouts/comparison-matrix.md
  • references/layouts/dashboard.md
  • references/layouts/dense-modules.md
  • references/layouts/funnel.md
  • references/layouts/hierarchical-layers.md
  • references/layouts/hub-spoke.md
  • references/layouts/iceberg.md
  • … and 33 more

Open the folder on GitHubat commit 1567581

Used in 1 other repository

We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in JimLiu/baoyu-skills, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Layout and Style Infographic Maker next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Layout and Style Infographic Maker compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Layout and Style Infographic Maker this skillJimLiu/baoyu-skills27k1 repos~4.9kAutomated safety check: PassMIT
Image Generationonyx-dot-app/onyx32k1 repos~1.7kAutomated safety check: PassCustom licence
SEO Image GeneratorAgriciDaniel/claude-seo19k2 repos~2.1kAutomated safety check: PassMIT
Ecom Image2buluslan/gpt-image2-ecommerce410—~2.9kAutomated safety check: PassMIT
Design Image Studiokangarooking/design-image-studio102—~1.5kAutomated safety check: PassMIT
Gemini Carouselcharlie947/social-media-skills3.8k—~1.7kAutomated safety check: PassMIT

Similar skills

  • Image Generation

    onyx-dot-app/onyx

    Generate or edit raster images (photos, illustrations, textures, sprites, mockups, logos, infographics) using the workspace's configured image-generation provider via onyx-cli image.

    32k GitHub starsUsed in 1 repo~1.7k tokens
    Media & CreativeAuto-check passed
  • SEO Image Generator

    AgriciDaniel/claude-seo

    Generates Open Graph previews, blog hero images, product photos and infographics for SEO use through Gemini image tools and the banana extension.

    19k GitHub starsUsed in 2 repos~2.1k tokens
    Media & CreativeAuto-check passed
  • Ecom Image2

    buluslan/gpt-image2-ecommerce

    由 buluslan(公众号:新西楼.AI)研发的开源电商做图 Skill:39 个电商场景模板、Campaign 套图一致性、GPT-Image-2.5 官方双模型路由(Flare/Sunburst)与平台技术预检。通过用户配置的 OpenAI 兼容端点生成图片,或导出 prompt 包手动使用。Trigger whenever the user wants product main…

    410 GitHub stars~2.9k tokensUpdated 24 days ago
    Media & CreativeAuto-check passed
  • Design Image Studio

    kangarooking/design-image-studio

    Directly generate design-oriented AI images with strong creative direction and prompt engineering.

    102 GitHub stars~1.5k tokensUpdated 5 mo ago
    Media & CreativeAuto-check passed
  • Gemini Carousel

    charlie947/social-media-skills

    Generate a branded slide-by-slide LinkedIn carousel using Gemini.

    3.8k GitHub stars~1.7k tokensUpdated 26 days ago
    Media & CreativeAuto-check passed
  • Blog Image

    AgriciDaniel/claude-blog

    AI image generation and editing for blog content powered by Gemini via MCP.

    2.3k GitHub stars~3.4k tokensUpdated 2 days ago
    Media & CreativeAuto-check passed

More from JimLiu/baoyu-skills

All 22 skills in this repo
  • Markdown Article Formatter

    JimLiu/baoyu-skills

    Reformats plain text or Markdown articles with frontmatter, a title, a summary, headings, bold, lists and code blocks, and saves a separate formatted copy.

    27k GitHub starsUsed in 6 repos~3.5k tokens
    Auto-check passed
  • X to Markdown Converter

    JimLiu/baoyu-skills

    Saves tweets, threads and X Articles as Markdown files with YAML front matter, using an unofficial API that asks for your consent first.

    27k GitHub starsUsed in 4 repos~1.8k tokens
    Auto-check: warnings
  • SVG Diagram Generator

    JimLiu/baoyu-skills

    Creates standalone dark-themed SVG diagrams, including architecture, flowchart, sequence, structural, mind map, timeline and state machine types.

    27k GitHub starsUsed in 1 repo~3.1k tokens
    Auto-check passed
  • Publishes articles and image-text posts to a WeChat Official Account through the API or Chrome CDP, converting markdown to WeChat-ready HTML with link citations.

    27k GitHub starsUsed in 2 repos~3.6k tokens
    Auto-check: warnings
  • Image Compressor

    JimLiu/baoyu-skills

    Compresses images to WebP by default, or to PNG or JPEG, picking the best available tool on the machine and optionally processing whole folders.

    27k GitHub starsUsed in 5 repos~598 tokens
    Auto-check passed
  • Generates text and images through an unofficial, reverse-engineered Gemini Web API, supporting reference images and multi-turn conversations.

    27k GitHub starsUsed in 5 repos~1.6k tokens
    Auto-check passed

Questions about Layout and Style Infographic Maker

What does Layout and Style Infographic Maker do?

Generates infographics from your content by pairing one of 21 layout types with one of 22 visual styles, after analyzing the material and recommending combinations. Two choices define an infographic here: the layout, which is the information structure, and the style, which is the visual look, and any layout can be paired with any style. The skill offers 21 layouts and 22 styles, analyzes your content, recommends layout and style pairings, and then generates the finished image.

When should I use Layout and Style Infographic Maker?

Layout and Style Infographic Maker fits situations like: turning an article or report into a visual summary; comparing options with a matrix, funnel or hub-and-spoke layout; trying several layout and style pairings for the same content.

How do I install Layout and Style Infographic Maker in Claude Code?

Run `npx skills add JimLiu/baoyu-skills --skill baoyu-infographic -a claude-code`. Or copy the skill folder (skills/baoyu-infographic in JimLiu/baoyu-skills) into .claude/skills/baoyu-infographic in your project. Claude Code loads it when a task matches its description.

How do I install Layout and Style Infographic Maker in Codex?

Run `npx skills add JimLiu/baoyu-skills --skill baoyu-infographic -a codex`. Or copy the skill folder (skills/baoyu-infographic in JimLiu/baoyu-skills) into .agents/skills/baoyu-infographic in your project. Codex loads it when a task matches its description.

Can I use Layout and Style Infographic Maker in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add JimLiu/baoyu-skills --skill baoyu-infographic -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/baoyu-infographic, .gemini/skills/baoyu-infographic, .github/skills/baoyu-infographic and .opencode/skills/baoyu-infographic in your project.

What does Layout and Style Infographic Maker need to run?

Going by SKILL.md and its folder, Layout and Style Infographic Maker needs the command-line tools its instructions call (codex). Our summary lists: An image rendering backend available to the agent.

Does Layout and Style Infographic Maker access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Layout and Style Infographic Maker safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Layout and Style Infographic Maker use?

Layout and Style Infographic Maker is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Layout and Style Infographic Maker use?

About 4.9k tokens (SKILL.md is roughly 20k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 19k tokens, read only when the agent opens those files.

What are the alternatives to Layout and Style Infographic Maker?

Skills that share tags, products or a category with Layout and Style Infographic Maker: Image Generation (onyx-dot-app/onyx, 32k stars), SEO Image Generator (AgriciDaniel/claude-seo, 19k stars), Ecom Image2 (buluslan/gpt-image2-ecommerce, 410 stars) and Design Image Studio (kangarooking/design-image-studio, 102 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Layout and Style Infographic Maker?

JimLiu (a GitHub user) maintains it in JimLiu/baoyu-skills, which has 26,507 GitHub stars. The repository holds 22 skills in this directory. The repository was last updated on September 10, 2026.

Source: JimLiu/baoyu-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.