Xiaohongshu Infographic Series Generator
Break down complex content into eye-catching infographic series for Xiaohongshu.
Usage
# Auto-select style and layout based on content
/xhs-images posts/ai-future/article.md
# Specify style
/xhs-images posts/ai-future/article.md --style notion
# Specify layout
/xhs-images posts/ai-future/article.md --layout dense
# Combine style and layout
/xhs-images posts/ai-future/article.md --style tech --layout list
# Direct content input
/xhs-images
[paste content]
Options
| Option |
Description |
--style <name> |
Visual style (see Style Gallery below) |
--layout <name> |
Information layout (see Layout Gallery below) |
Two Dimensions
| Dimension |
Controls |
Options |
| Style |
Visual aesthetics: colors, lines, decorations |
cute, fresh, tech, warm, bold, minimal, retro, pop, notion, productivity, insight |
| Layout |
Information structure: density, arrangement |
sparse, balanced, dense, list, comparison, flow |
Style × Layout can be freely combined. Example: --style notion --layout dense creates an intellectual-looking knowledge card with high information density.
Style Gallery (Quick Reference)
| Style |
Description |
Best For |
cute |
Sweet, adorable, girly - classic XHS aesthetic |
Lifestyle, beauty, fashion |
fresh |
Clean, refreshing, natural |
Health, wellness, self-care |
tech |
Modern, smart, digital |
Tech tutorials, AI content |
warm |
Cozy, friendly, approachable |
Personal stories, life lessons |
bold |
High impact, attention-grabbing |
Important tips, warnings |
minimal |
Ultra-clean, sophisticated |
Professional content |
retro |
Vintage, nostalgic, trendy |
Throwback, classic tips |
pop |
Vibrant, energetic, eye-catching |
Fun facts, announcements |
notion |
Minimalist hand-drawn line art |
Knowledge sharing, SaaS |
productivity |
Structured, light mode, clean UI |
How-to tutorials, tools |
insight |
High clarity, dark mode, premium |
Mental models, deep thoughts |
For detailed style specs (colors, elements, typography): See references/styles.md
Layout Gallery (Quick Reference)
| Layout |
Density |
Best For |
sparse |
1-2 points, 60-70% whitespace |
Covers, quotes, impactful statements |
balanced |
3-4 points, 40-50% whitespace |
Regular content, tutorials |
dense |
5-8 points, 20-30% whitespace |
Summary cards, cheat sheets |
list |
4-7 items, 30-40% whitespace |
Top N lists, checklists |
comparison |
2×2-4 points, 30-40% whitespace |
Before/After, pros/cons |
flow |
3-6 steps, 30-40% whitespace |
Processes, timelines |
For detailed layout specs and Style×Layout matrix: See references/layouts.md
Auto Selection Logic
Auto Style Selection
| Content Signals |
Selected Style |
| Beauty, fashion, cute, girl, pink |
cute |
| Health, nature, clean, fresh |
fresh |
| Tech, AI, code, digital, app, tool |
tech |
| Life, story, emotion, feeling |
warm |
| Warning, important, must, critical |
bold |
| Professional, business, elegant |
minimal |
| Classic, vintage, old, traditional |
retro |
| Fun, exciting, wow, amazing |
pop |
| Knowledge, concept, productivity, SaaS |
notion |
| How-to, tutorial, tool recommendation |
productivity |
| Mental model, deep thought, insight |
insight |
Auto Layout Selection
| Content Signals |
Selected Layout |
| Single quote, one key point, cover |
sparse |
| 3-4 points, explanation, tutorial |
balanced |
| 5+ points, summary, cheat sheet |
dense |
| Numbered items, top N, checklist |
list |
| vs, compare, before/after, pros/cons |
comparison |
| Process, flow, timeline, ordered steps |
flow |
Layout by Position
| Position |
Recommended Layout |
| Cover |
sparse |
| Content |
balanced / dense / list (content-appropriate) |
| Ending |
sparse or balanced |
File Management
With Article Path
Save to xhs-images/ subdirectory in the same folder as the article:
posts/ai-future/
├── article.md
└── xhs-images/
├── outline.md
├── prompts/
│ ├── 01-cover.md
│ └── ...
├── 01-cover.png
└── 02-ending.png
Without Article Path
Save to xhs-outputs/YYYY-MM-DD/[topic-slug]/
Workflow
Step 1: Analyze Content & Select Style/Layout
- Read content
- If
--style specified, use that style; otherwise auto-select
- If
--layout specified, use that layout; otherwise auto-select per image
- Determine image count:
- Simple topic: 2-3 images
- Medium complexity: 4-6 images
- Deep dive: 7-10 images
Step 2: Generate Outline
Plan for each image with style and layout specifications. Save as outline.md:
# Xiaohongshu Infographic Series Outline
**Topic**: [topic]
**Style**: [selected style]
**Default Layout**: [selected layout or "varies"]
**Image Count**: N
**Generated**: YYYY-MM-DD HH:mm
---
## Image 1 of N
**Position**: Cover
**Layout**: sparse
**Core Message**: [one-liner]
**Filename**: 01-cover.png
**Text Content**:
- Title: xxx
- Subtitle: xxx
**Visual Concept**: [style + layout appropriate description]
---
...
Step 3: Generate Images One by One
For each image:
- Read style details from
references/styles.md (load target style section only)
- Read layout details from
references/layouts.md (load target layout section only)
- Create prompt file in
prompts/ directory
- Generate using:
/gemini-web --promptfiles [SKILL_ROOT]/prompts/system.md [TARGET_DIR]/prompts/01-cover.md --image [TARGET_DIR]/01-cover.png
Prompt Format:
Infographic theme: [topic]
Style: [style name]
Layout: [layout name]
Position: [cover/content/ending]
Visual composition:
- Main visual: [style-appropriate description]
- Arrangement: [layout-specific structure]
- Decorative elements: [style-specific decorations]
Color scheme:
- Primary: [from style spec]
- Background: [from style spec]
- Accent: [from style spec]
Text content:
- Title: 「xxx」(large, prominent)
- Key points: [based on layout density]
Layout instructions: [from layout spec]
Style notes: [from style spec]
Step 4: Completion Report
Xiaohongshu Infographic Series Complete!
Topic: [topic]
Style: [style name]
Layout: [layout name or "varies"]
Location: [directory path]
Images: N total
- 01-cover.png ✓ Cover (sparse)
- 02-content-1.png ✓ Content (balanced)
- 03-ending.png ✓ Ending (sparse)
Outline: outline.md
Content Breakdown Principles
- Cover (Image 1): Strong visual impact, core title, attention hook →
sparse layout
- Content (Middle): Core points per image, density varies by content
- Ending (Last): Summary / call-to-action / memorable quote →
sparse or balanced
Notes
- Image generation typically takes 10-30 seconds per image
- Auto-retry once on generation failure
- Use cartoon alternatives for sensitive public figures
- Output language matches input content language
- Maintain selected style consistency across all images in series
Source: manwithshit/xhs-images — distributed by TomeVault.
1---2name: xhs-images3description: Xiaohongshu (Little Red Book) infographic series generator with multiple style options. Breaks down content into 1-10 cartoon-style infographics. Use when user asks to create "小红书图片", "XHS images", or "RedNote infographics". Use when this capability is needed.4---56# Xiaohongshu Infographic Series Generator78Break down complex content into eye-catching infographic series for Xiaohongshu.910## Usage1112```bash13# Auto-select style and layout based on content14/xhs-images posts/ai-future/article.md1516# Specify style17/xhs-images posts/ai-future/article.md --style notion1819# Specify layout20/xhs-images posts/ai-future/article.md --layout dense2122# Combine style and layout23/xhs-images posts/ai-future/article.md --style tech --layout list2425# Direct content input26/xhs-images27[paste content]28```2930## Options3132| Option | Description |33|--------|-------------|34| `--style <name>` | Visual style (see Style Gallery below) |35| `--layout <name>` | Information layout (see Layout Gallery below) |3637## Two Dimensions3839| Dimension | Controls | Options |40|-----------|----------|---------|41| **Style** | Visual aesthetics: colors, lines, decorations | cute, fresh, tech, warm, bold, minimal, retro, pop, notion, productivity, insight |42| **Layout** | Information structure: density, arrangement | sparse, balanced, dense, list, comparison, flow |4344Style × Layout can be freely combined. Example: `--style notion --layout dense` creates an intellectual-looking knowledge card with high information density.4546## Style Gallery (Quick Reference)4748| Style | Description | Best For |49|-------|-------------|----------|50| `cute` | Sweet, adorable, girly - classic XHS aesthetic | Lifestyle, beauty, fashion |51| `fresh` | Clean, refreshing, natural | Health, wellness, self-care |52| `tech` | Modern, smart, digital | Tech tutorials, AI content |53| `warm` | Cozy, friendly, approachable | Personal stories, life lessons |54| `bold` | High impact, attention-grabbing | Important tips, warnings |55| `minimal` | Ultra-clean, sophisticated | Professional content |56| `retro` | Vintage, nostalgic, trendy | Throwback, classic tips |57| `pop` | Vibrant, energetic, eye-catching | Fun facts, announcements |58| `notion` | Minimalist hand-drawn line art | Knowledge sharing, SaaS |59| `productivity` | Structured, light mode, clean UI | How-to tutorials, tools |60| `insight` | High clarity, dark mode, premium | Mental models, deep thoughts |6162**For detailed style specs (colors, elements, typography)**: See `references/styles.md`6364## Layout Gallery (Quick Reference)6566| Layout | Density | Best For |67|--------|---------|----------|68| `sparse` | 1-2 points, 60-70% whitespace | Covers, quotes, impactful statements |69| `balanced` | 3-4 points, 40-50% whitespace | Regular content, tutorials |70| `dense` | 5-8 points, 20-30% whitespace | Summary cards, cheat sheets |71| `list` | 4-7 items, 30-40% whitespace | Top N lists, checklists |72| `comparison` | 2×2-4 points, 30-40% whitespace | Before/After, pros/cons |73| `flow` | 3-6 steps, 30-40% whitespace | Processes, timelines |7475**For detailed layout specs and Style×Layout matrix**: See `references/layouts.md`7677## Auto Selection Logic7879### Auto Style Selection8081| Content Signals | Selected Style |82|----------------|----------------|83| Beauty, fashion, cute, girl, pink | `cute` |84| Health, nature, clean, fresh | `fresh` |85| Tech, AI, code, digital, app, tool | `tech` |86| Life, story, emotion, feeling | `warm` |87| Warning, important, must, critical | `bold` |88| Professional, business, elegant | `minimal` |89| Classic, vintage, old, traditional | `retro` |90| Fun, exciting, wow, amazing | `pop` |91| Knowledge, concept, productivity, SaaS | `notion` |92| How-to, tutorial, tool recommendation | `productivity` |93| Mental model, deep thought, insight | `insight` |9495### Auto Layout Selection9697| Content Signals | Selected Layout |98|----------------|-----------------|99| Single quote, one key point, cover | `sparse` |100| 3-4 points, explanation, tutorial | `balanced` |101| 5+ points, summary, cheat sheet | `dense` |102| Numbered items, top N, checklist | `list` |103| vs, compare, before/after, pros/cons | `comparison` |104| Process, flow, timeline, ordered steps | `flow` |105106### Layout by Position107108| Position | Recommended Layout |109|----------|-------------------|110| Cover | `sparse` |111| Content | `balanced` / `dense` / `list` (content-appropriate) |112| Ending | `sparse` or `balanced` |113114## File Management115116### With Article Path117118Save to `xhs-images/` subdirectory in the same folder as the article:119120```121posts/ai-future/122├── article.md123└── xhs-images/124 ├── outline.md125 ├── prompts/126 │ ├── 01-cover.md127 │ └── ...128 ├── 01-cover.png129 └── 02-ending.png130```131132### Without Article Path133134Save to `xhs-outputs/YYYY-MM-DD/[topic-slug]/`135136## Workflow137138### Step 1: Analyze Content & Select Style/Layout1391401. Read content1412. If `--style` specified, use that style; otherwise auto-select1423. If `--layout` specified, use that layout; otherwise auto-select per image1434. Determine image count:144 - Simple topic: 2-3 images145 - Medium complexity: 4-6 images146 - Deep dive: 7-10 images147148### Step 2: Generate Outline149150Plan for each image with style and layout specifications. Save as `outline.md`:151152```markdown153# Xiaohongshu Infographic Series Outline154155**Topic**: [topic]156**Style**: [selected style]157**Default Layout**: [selected layout or "varies"]158**Image Count**: N159**Generated**: YYYY-MM-DD HH:mm160161---162163## Image 1 of N164165**Position**: Cover166**Layout**: sparse167**Core Message**: [one-liner]168**Filename**: 01-cover.png169170**Text Content**:171- Title: xxx172- Subtitle: xxx173174**Visual Concept**: [style + layout appropriate description]175176---177...178```179180### Step 3: Generate Images One by One181182For each image:1831841. Read style details from `references/styles.md` (load target style section only)1852. Read layout details from `references/layouts.md` (load target layout section only)1863. Create prompt file in `prompts/` directory1874. Generate using:188189```bash190/gemini-web --promptfiles [SKILL_ROOT]/prompts/system.md [TARGET_DIR]/prompts/01-cover.md --image [TARGET_DIR]/01-cover.png191```192193**Prompt Format**:194195```markdown196Infographic theme: [topic]197Style: [style name]198Layout: [layout name]199Position: [cover/content/ending]200201Visual composition:202- Main visual: [style-appropriate description]203- Arrangement: [layout-specific structure]204- Decorative elements: [style-specific decorations]205206Color scheme:207- Primary: [from style spec]208- Background: [from style spec]209- Accent: [from style spec]210211Text content:212- Title: 「xxx」(large, prominent)213- Key points: [based on layout density]214215Layout instructions: [from layout spec]216Style notes: [from style spec]217```218219### Step 4: Completion Report220221```222Xiaohongshu Infographic Series Complete!223224Topic: [topic]225Style: [style name]226Layout: [layout name or "varies"]227Location: [directory path]228Images: N total229230- 01-cover.png ✓ Cover (sparse)231- 02-content-1.png ✓ Content (balanced)232- 03-ending.png ✓ Ending (sparse)233234Outline: outline.md235```236237## Content Breakdown Principles2382391. **Cover (Image 1)**: Strong visual impact, core title, attention hook → `sparse` layout2402. **Content (Middle)**: Core points per image, density varies by content2413. **Ending (Last)**: Summary / call-to-action / memorable quote → `sparse` or `balanced`242243## Notes244245- Image generation typically takes 10-30 seconds per image246- Auto-retry once on generation failure247- Use cartoon alternatives for sensitive public figures248- Output language matches input content language249- Maintain selected style consistency across all images in series250251---252> Source: [manwithshit/xhs-images](https://github.com/manwithshit/xhs-images) — distributed by [TomeVault](https://tomevault.io).253<!-- tomevault:4.0:skill_md:2026-06-17 -->