xiaohongshu-images

SKILL.md

Transform markdown and HTML into beautifully styled 3:4 ratio images optimized for Xiaohongshu posting.

Accepts markdown, HTML, or text input and generates AI-powered cover images via the baoyu-cover-image skill

Produces styled HTML pages with dark gradient backgrounds, cream-colored cards, and responsive typography using Google Fonts

Captures sequential 3:4 aspect ratio screenshots (1200×1600px at 2x scale) with intelligent text boundary detection to prevent content cutoff

Supports multiple account folders (james-cn, james-en, mom-reading-club) with automatic account resolution via explicit parameters, file path inference, or template mapping

Includes built-in Xiaohongshu community compliance checks for prohibited claims, imagery, and content types

Xiaohongshu Images Skill

This skill transforms markdown, HTML, or text content into beautifully styled HTML pages with AI-generated cover images, then captures them as sequential screenshots at 3:4 ratio for Xiaohongshu posting.

Overview

The skill performs the following workflow:

Accept Content: Receives markdown, HTML, or txt format content from the user

Load Prompt Template: Reads the prompt template from prompts/default.md in this skill's directory

Determine Output Account: Determines which account folder to use (see Account Folder Resolution below)

Generate Cover Image: Uses /baoyu-cover-image skill to generate a cover image based on the article content

Generate HTML: Creates a beautifully styled HTML page following the prompt template specifications

Save Output: Saves the HTML to ~/Dev/obsidian/{account_folder}/articles/<date-title>/xhs-preview.html

Capture Screenshots: Takes sequential 3:4 ratio screenshots of the entire page without cutting text

Account Folder Resolution

The skill determines the output account folder using the following priority: