GitHub to Xiaohongshu

GitHub to Xiaohongshu Skill

Transform any GitHub repository into engaging Xiaohongshu (小红书) infographic content.

Usage

# Basic usage - analyze a GitHub repo and generate XHS content
/github-to-xhs https://github.com/user/repo
With specific focus
/github-to-xhs https://github.com/user/repo --focus "AI features"
After generation, files are in:
/root/.openclaw/workspace/xhs-images/{repo-slug}/

Workflow

Step 1: Fetch GitHub Repository

Use web_fetch to get the repository's README and main content.

https://github.com/{owner}/{repo}

Step 2: Content Analysis

Analyze the repository and create analysis.md:

# {repo-name} Analysis
Project Info
Name: {name}
Author: {author}
Stars: {stars}
Language: {language}
Description: {description}
Core Features
Feature 1
Feature 2
...
Target Audience
Audience 1
Audience 2
XHS Angles
Hook ideas (max 20 characters for title)
Visual opportunities

Step 3: Generate Outline Strategies

Create 6 different outline strategies with distinct visual styles:

Strategy A - Story-Driven (outline-strategy-a.md)

Strategy B - Information-Dense (outline-strategy-b.md)

Strategy C - Visual-First (outline-strategy-c.md)

Strategy D - Cyberpunk Tech (outline-strategy-d.md) ⭐ NEW

Strategy E - Warm Hand-drawn (outline-strategy-e.md) ⭐ NEW

Strategy F - Dark Professional (outline-strategy-f.md) ⭐ NEW

Step 4: User Selection

Present all 6 strategies and ask user to choose:

📋 Select your preferred strategy:
A: Story-Driven (4 images, emotional, warm)
B: Information-Dense (5 images, technical, notion) ⭐ Default
C: Visual-First (3 images, bold, minimal)
D: Cyberpunk Tech (4-5 images, neon dark, dev tools)
E: Warm Hand-drawn (4-5 images, sketchy, educational)
F: Dark Professional (5 images, premium, enterprise)
Or specify a style: "Use cyberpunk style" / "Make it warm and friendly"

Step 5: Generate Content

Create final files:

1. outline.md - Selected strategy 2. prompts/NN-{type}-{slug}.md - Image generation prompts for each slide 3. xiaohongshu-post.html - Complete HTML with all 5 slides styled for XHS

Step 6: Package Output

Create tar.gz archive with timestamp and version:

tar -czf {repo-slug}-xhs-{YYYYMMDD}-v{N}.tar.gz {repo-slug}/

Naming Convention: {repo-slug}-xhs-{date}-v{version}.tar.gz

Output Structure

xhs-images/{repo-slug}/
├── source-{slug}.md              # Original GitHub content
├── analysis.md                   # Content analysis
├── outline-strategy-a.md         # Story-driven (warm)
├── outline-strategy-b.md         # Information-dense (notion)
├── outline-strategy-c.md         # Visual-first (bold)
├── outline-strategy-d.md         # Cyberpunk tech (NEW)
├── outline-strategy-e.md         # Warm hand-drawn (NEW)
├── outline-strategy-f.md         # Dark professional (NEW)
├── outline.md                    # Final selected outline
├── xiaohongshu-post.html         # Complete visual output
├── xiaohongshu-article.md        # Article content for XHS caption
├── prompts/                      # Image generation prompts
│   ├── 01-cover-{slug}.md
│   ├── 02-features-{slug}.md
│   └── ...
└── {repo-slug}-xhs-{YYYYMMDD}-v{N}.tar.gz  # Final package

HTML Output Features

The generated xiaohongshu-post.html includes multiple visual style templates:

Available Style Themes

| Theme | Best For | Colors | Aesthetic | |-------|----------|--------|-----------| | Notion (Default) | Technical docs, tools | Off-white, gray, subtle accents | Clean, minimal, grid background | | Cyberpunk | AI tools, dev projects | Dark bg, neon cyan/pink/purple | Glowing, futuristic, high contrast | | Warm | Tutorials, education | Cream, earth tones, warm accents | Hand-drawn, friendly, organic | | Dark Pro | Enterprise, SaaS | Navy/black, gold/amber accents | Premium, sleek, glassmorphism | | Bold Pop | Visual products | Solid vibrant colors, high contrast | Eye-catching, minimal text |

CSS Features (All Themes)

Image Generation Prompts

Each prompt file includes:

Examples

Example 1: Tool/Library

User: /github-to-xhs https://github.com/mvanhorn/last30days-skill
Output: 5-card XHS post about multi-source research tool
P1: Cover with 10 platform logos
P2: 4 core features
P3: Algorithm pie chart
P4: Manual vs Auto comparison
P5: Install commands

Example 2: Framework

User: /github-to-xhs https://github.com/vercel/next.js
Output: Technical introduction with:
Key features highlight
Performance metrics
Code examples
Getting started guide

File Naming Standards

When delivering files to users, always use the following format:

Archive File: {repo-slug}-xhs-{YYYYMMDD}-v{N}.tar.gz

Example: hermes-agent-xhs-20250413-v2.tar.gz

Delivery Message Template

When sending the file, include: 1. Filename with date and version 2. Brief description of contents 3. Usage instructions

文件名: {repo-slug}-xhs-{YYYYMMDD}-v{N}.tar.gz
日期: {YYYY-MM-DD}
版本: v{N}
包含:
xiaohongshu-post.html - 5页卡片
xiaohongshu-article.md - 正文文案
prompts/ - AI绘图提示词

Tips

Example 1: Tool/Library

User: /github-to-xhs https://github.com/mvanhorn/last30days-skill
Output: 5-card XHS post about multi-source research tool
P1: Cover with 10 platform logos
P2: 4 core features
P3: Algorithm pie chart
P4: Manual vs Auto comparison
P5: Install commands

Example 2: Framework

User: /github-to-xhs https://github.com/vercel/next.js
Output: Technical introduction with:
Key features highlight
Performance metrics
Code examples
Getting started guide