pw-cover-image

Cover Image Generator

Generate hand-drawn style cover images for articles, with support for multiple style options.

Quick Start

Simplest Usage:

/pw-cover-image path/to/article.md

The system will automatically analyze the content, select a style, and generate the cover.

Common Scenarios:

# 技术文章
/pw-cover-image article.md --style blueprint

# 社交媒体方形封面
/pw-cover-image article.md --aspect 1:1

Pure Visual Background (No Title)

/pw-cover-image article.md --no-title

Video Cover

/pw-cover-image article.md --aspect 16:9 --style bold-editorial

**文档导航**:
- 参数说明 → 了解所有可用参数
- 风格画廊 → 查看 19 种预设风格
- 常见问题与错误处理 → 解决使用问题
- 使用建议与最佳实践 → 提高封面质量
- 工作流程 → 了解内部处理步骤

## 使用方法

```bash
# 从 markdown 文件生成 (根据内容自动选择风格)
/pw-cover-image path/to/article.md

# 指定风格
/pw-cover-image path/to/article.md --style blueprint
/pw-cover-image path/to/article.md --style warm
/pw-cover-image path/to/article.md --style dark-atmospheric

# 不包含标题文字
/pw-cover-image path/to/article.md --no-title

# 组合选项
/pw-cover-image path/to/article.md --style minimal --no-title

# 从直接输入的文本生成
/pw-cover-image
[粘贴内容或描述主题]

# 直接输入并指定风格
/pw-cover-image --style playful
[粘贴内容]

Parameter Description

--style

Specify the visual style of the cover.

Parameter Type: string (optional)

Optional Values: see the 19 preset styles in the "Style Gallery" section below

Default Behavior: if not specified, the system will automatically select the most suitable style based on the article content

Usage Example:

/pw-cover-image article.md --style blueprint  # 技术文档使用蓝图风格
/pw-cover-image article.md --style warm      # 个人故事使用温暖风格

Best Practices:

• Recommended for technical articles: blueprint, intuition-machine, editorial-infographic
• Recommended for product articles: bold-editorial, notion, minimal
• Recommended for story articles: warm, watercolor, fantasy-animation
• When unsure, leave blank and let the system choose automatically

--aspect

Specify the aspect ratio of the cover image.

Parameter Type: string (optional)

Optional Values:

• 2.35:1 - cinematic ultra-widescreen (default), suitable for blog headers and banners
• 16:9 - standard widescreen, suitable for video covers and presentations
• 1:1 - square, suitable for social media (WeChat, Weibo, Instagram)

Default Value: 2.35:1

Usage Example:

/pw-cover-image article.md --aspect 16:9  # 视频封面
/pw-cover-image article.md --aspect 1:1   # 社交媒体

Best Practices:

• Blog articles: use 2.35:1 for stronger visual impact
• Video content: use 16:9 to match video platforms
• Social sharing: use 1:1 to ensure complete display on all platforms

--lang

Specify the language of the cover title text.

Parameter Type: language code (optional)

Optional Values: en (English), zh (Chinese), ja (Japanese), and other standard language codes

Default Behavior:

• If the article language matches the conversation language, use that language automatically
• If they do not match, ask the user to choose before generating

Usage Example:

/pw-cover-image article.md --lang en  # 强制使用英文标题
/pw-cover-image article.md --lang zh  # 强制使用中文标题

Best Practices:

• Target readers are Chinese users: use zh
• International content: use en
• Usually no need to specify manually; the system will determine it intelligently

--no-title

Generate a pure visual cover without title text.

Parameter Type: boolean flag (optional)

Default Behavior: include title text

Use Cases:

• Need to add custom text later
• Pure visual background image
• Need to use different titles on different occasions

Usage Example:

/pw-cover-image article.md --no-title
/pw-cover-image article.md --style minimal --no-title

Notes:

• After using this option, the cover will contain only visual elements and decorations
• Suitable for scenarios requiring flexibility

Style Gallery

Style	Description
elegant (default)	Refined, elegant, understated
blueprint	Technical drawings, engineering precision
bold-editorial	Magazine cover impact, dramatic typography
chalkboard	Black chalkboard, colored chalk drawings
dark-atmospheric	Cinematic dark mode, glowing accents
editorial-infographic	Magazine explainer, visual storytelling
fantasy-animation	Ghibli/Disney style, whimsical charm
intuition-machine	Technical brief, bilingual labels
minimal	Ultra-minimal, zen, focused
nature	Organic, calm, natural
notion	Clean SaaS dashboard, productivity style
pixel-art	Retro 8-bit, nostalgic game aesthetic
playful	Fun, creative, whimsical
retro	Halftone dots, vintage badge, classic
sketch-notes	Hand-drawn, educational, warm
vector-illustration	Flat vector, black outlines, retro colors
vintage	Aged paper, historical, expedition style
warm	Friendly, approachable, human-centered
watercolor	Soft hand-drawn, natural warmth

Detailed style definition: references/styles/<style>.md

Automatic style selection

When not specified --style , the system analyzes the content to choose the best style:

Content characteristics	Selected style
Architecture, system design, engineering	blueprint
Product launch, keynote, marketing, branding	bold-editorial
Education, classroom, tutorial, teaching	chalkboard
Entertainment, creative, premium, cinematic	dark-atmospheric
Technical explainer, science, research	editorial-infographic
Storytelling, children, fantasy, magic	fantasy-animation
Technical documentation, academic, bilingual	intuition-machine
Personal story, emotion, growth, life	warm
Simple, zen, focused, essential	minimal
Fun, simple, beginner, casual	playful
Nature, eco-friendly, health, organic	nature
Pop culture, 80s/90s nostalgia, badges	retro
Product, SaaS, dashboard, productivity	notion
Games, retro tech, developer, 8-bit	pixel-art
Education, tutorial, knowledge sharing	sketch-notes
Creative proposal, branding, toy style	vector-illustration
History, exploration, heritage, biography	vintage
Lifestyle, travel, food, personal	watercolor
Business, professional, strategy, analysis	elegant

File management

Output directory

Each session creates a separate directory named after the content topic:

cover-image/{topic-slug}/
├── source-{slug}.{ext}    # 源文件 (文本、图片等)
├── prompts/
│   └── cover.md
└── cover.png

Topic naming rules:

1. Extract the topic from the content (2-4 words, kebab-case)
2. Example: "The Future of AI" → ai-future

Conflict resolution

If cover-image/{topic-slug}/ already exists:

• Append timestamp: {topic-slug}-YYYYMMDD-HHMMSS
• Example: ai-future already exists → ai-future-20260118-143052

Source files

Use source-{slug}.{ext} naming to copy all source files:

• source-article.md (main text content)
• source-logo.png (images in the conversation)

Supports multiple source files: text, images, files in the conversation.

Workflow

Process overview:

1. Analyze content → extract topic, tone, keywords
2. Determine options → automatically select or use the specified style and aspect ratio
3. Confirm options → Confirm all parameters at once (style, aspect ratio, language)
4. Generate concept → Create title and visual elements
5. Create prompt → Save to prompts/cover.md
6. Generate image → Call the image generation service
7. Output summary → Display results and file locations

User interaction points:

• User confirmation is required only in step 3 (confirm all options at once)
• If there are multiple image generation services, ask for a selection in step 6

Step 1: Analyze content

1. Save source content (if it is not already a file):

   • If the user provides a file path: use it directly
   • If the user pastes content: save it to the target directory's source.md

2. Extract key information:

   • Topic: What is the article about?
   • Core message: What are the key points?
   • Tone: Serious, fun, inspiring, educational?
   • Keywords: Identify style signal words

3. Language detection:

   • Detect the content'ssource language
   • Detect the conversation context'suser language
   • Note: source language ≠ user language (will be asked in step 3)

Step 2: Determine options

1. Style selection:

   • If --styleis specified, use that style
   • Otherwise, scan the content for style signals and automatically select 3 candidates
   • If there are no clear signals, use elegant

2. Aspect ratio:

   • If --aspectis specified, use that ratio
   • Otherwise, prepare options: 2.35:1 (cinematic), 16:9 (widescreen), 1:1 (social media)

Step 3: Confirm options

Purpose: Let the user confirm all options at once before generation.

Important: Use AskUserQuestion to present all options in a single confirmation step. Do not interrupt the workflow with multiple separate confirmations.

Determine the questions to ask:

Question	When to ask
Style	Always (required)
Aspect ratio	Always (provide common options)
Language	Only when 源语言 ≠ 用户语言

Present options (use AskUserQuestion to include all applicable questions):

Question 1 (style) - Always:

• Style A (recommended): [style name] - [brief description]
• Style B: [style name] - [brief description]
• Style C: [style name] - [brief description]
• Custom: provide a custom style reference

Question 2 (aspect ratio) - Always:

• 2.35:1 Cinematic (recommended) - ultra-wide, dramatic
• 16:9 Widescreen - standard video/presentation
• 1:1 Square - social media optimized

Question 3 (language) - Only when source language ≠ user language:

• [source language] (match content)
• [User Language] (your preference)

Language Handling:

• If source language = user language: just inform the user (e.g. "the title will be in Chinese")
• If different: ask which language to use for the title text

Step 4: Generate Cover Concept

Create a cover image concept based on the selected style:

Title (if included, max 8 characters):

• Distill the core message into a powerful title
• Use hooks: numbers, questions, contrasts, pain points
• If using --no-title logo, skip

Visual Elements:

• Images and icons that match the style
• 1-2 symbolic elements representing the theme
• Metaphors or analogies that match the style

Step 5: Create Prompt File

Save the prompt to using the confirmed options prompts/cover.md。

All prompts are written using the user's confirmed language preference.

Prompt Format:

封面主题: [2-3 个词的主题]
风格: [选定的风格名称]
宽高比: [确认的宽高比]

[如果包含标题:]
标题文字: [8 个字符或更少, 使用确认的语言]
副标题: [可选, 使用确认的语言]

视觉构图:
- 主视觉: [匹配风格的描述]
- 布局: [基于标题包含和宽高比的定位]
- 装饰元素: [符合风格的元素]

配色方案:
- 主色: [风格主色]
- 背景: [风格背景色]
- 点缀: [风格点缀色]

风格注释: [要强调的特定风格特征]

[如果无标题:]
注意: 无标题文字, 仅纯视觉插图。

Step 6: Generate Image

Image Generation Skill Selection:

1. Check available image generation skills
2. If multiple skills are available, ask the user to choose

Generate: Call the selected image generation skill using the prompt file, output path, and confirmed aspect ratio.

Step 7: Output Summary

封面图已生成!

主题: [主题]
风格: [风格名称]
宽高比: [宽高比]
标题: [封面标题] (或 "无标题 - 仅视觉")
语言: [确认的语言]
位置: [输出路径]

预览图片以验证是否符合你的期望。

Notes

• The cover should be immediately understandable at small preview sizes
• The title (if included) must be readable and impactful
• Visual metaphors work better than literal representations
• Maintain style consistency throughout the cover
• Image generation usually takes 10-30 seconds
• Title text uses the user's confirmed language preference
• Aspect ratio: 2.35:1 for cinematic/dramatic, 16:9 for widescreen, 1:1 for social media

Common Issues and Error Handling

File Path Issues

Problem: The specified article file cannot be found

Cause: The file path is incorrect or the file does not exist

Solution:

• Make sure to use an absolute path or a correct path relative to the current working directory
• Check whether the file extension is correct (.md, .txt, etc.)
• Use ls command to verify whether the file exists

Example:

# 错误
/pw-cover-image article.md  # 如果不在文件所在目录

# 正确
/pw-cover-image /path/to/article.md
/pw-cover-image ./docs/article.md

Content Analysis Failure

Problem: Unable to extract a valid theme from the article

Cause: The article content is too short, improperly formatted, or the language is unsupported

Solution:

• Make sure the article contains at least 100 characters of valid content
• Check whether the article contains basic structure such as a title and paragraphs
• For non-standard formats, you can manually specify style parameters

Best Practices:

• Provide the complete article content, not fragments
• Include the title and main paragraphs
• Avoid pure code or pure data content

Unsatisfactory Style Selection

Problem: The automatically selected style does not meet expectations

Cause: The article content features are not obvious or it contains multiple themes

Solution:

• Use --style parameter to manually specify the style
• Refer to the "Auto Style Selection" table to understand the matching rules
• Try different styles and compare the results

Example:

# 如果自动选择不理想, 手动指定
/pw-cover-image article.md --style blueprint

Image generation timed out

Problem: Image generation takes too long or fails

Cause: Network issues, the image generation service being busy, or the prompt being too complex

Solution:

• Wait 30-60 seconds and retry
• Check the network connection
• Simplify the content or use a simpler style (such as minimal)
• Use --no-title to reduce generation complexity

Title text display issue

Problem: The title text is too long or displayed incompletely

Cause: The automatically extracted title exceeds the 8-character limit

Solution:

• The system will automatically shorten the title to within 8 characters
• If you are still not satisfied, use --no-title to add it manually later
• Clearly state the core topic at the beginning of the article to help the system extract a better title

Language detection error

Problem: The title language does not match expectations

Cause: The article contains multiple languages or language detection is inaccurate

Solution:

• Use --lang parameter to explicitly specify the language
• Select the correct language option in the confirmation step

Example:

/pw-cover-image article.md --lang zh  # 强制中文标题

Directory conflict

Problem: The output directory already exists, and you are worried about overwriting previous files

Cause: A cover with the same topic has already been generated

Solution:

• The system will automatically add a timestamp to avoid conflicts
• Format: {topic-slug}-YYYYMMDD-HHMMSS
• It will not overwrite existing files, so you can safely regenerate

Example:

cover-image/ai-future/           # 第一次生成
cover-image/ai-future-20260123-143052/  # 第二次生成

Usage recommendations and best practices

Content preparation

Provide a complete article:

• Include the title, introduction, and body paragraphs
• At least 200-500 words of valid content
• A clear topic and core viewpoint

Optimize the article structure:

• Clearly state the core topic at the beginning
• Use clear paragraph divisions
• Include keywords and topic words

Style selection strategy

Let the system choose automatically (recommended):

• Suitable for most scenarios
• The system will analyze the content features and recommend 3 candidate styles
• Can be adjusted in the confirmation step

Manually specify the style:

• Scenarios with high brand consistency requirements
• Situations where the target style is known
• Need to generate covers with a unified style in batches

Style testing:

• If unsure, you can generate multiple versions for comparison
• Use --no-title to generate a pure visual version for easy reuse

Aspect ratio selection

Choose according to the publishing platform:

• Blog/website header image: 2.35:1 (default)
• Video platforms (YouTube, Bilibili): 16:9
• Social media (WeChat, Weibo, Instagram): 1:1

Multi-platform publishing:

• Generate multiple aspect ratio versions
• Use the same style to maintain consistency

Example Workflow:

# 为同一文章生成多个版本
/pw-cover-image article.md --aspect 2.35:1  # 博客版
/pw-cover-image article.md --aspect 16:9    # 视频版
/pw-cover-image article.md --aspect 1:1     # 社交版

Batch Generation

Series Articles:

• Use the same --style to maintain visual consistency
• Let titles be generated automatically to reflect differences
• Build brand recognition

Example:

/pw-cover-image article-1.md --style blueprint
/pw-cover-image article-2.md --style blueprint
/pw-cover-image article-3.md --style blueprint

Quality Optimization

Improve cover quality:

• Provide high-quality article content
• Clarify the core theme and key information
• Choose a style that matches the content

Title Optimization:

• Use a strong title at the beginning of the article
• Include numbers, questions, or contrasts
• Avoid titles that are too long or too abstract

Visual Effects:

• Preview the generated cover
• Check readability at the target size
• Regenerate or adjust parameters if necessary

Workflow Integration

Work with other tools:

• Complete the article writing first
• Use this tool to generate the cover
• Use an image editing tool for fine-tuning (if needed)

File Management:

• The output directory is automatically organized by topic
• Keep source files and prompts for traceability
• Regularly clean up unneeded versions

Performance Optimization

Reduce generation time:

• Use simple styles (minimal, elegant)
• Use --no-title to reduce complexity
• Avoid generating during peak network hours

Improve the success rate:

• Ensure a stable network connection
• Provide clear article content
• Use the recommended parameter combination

Advanced Usage

Custom Styles

Add custom style configurations through the EXTEND.md file.

Configuration path (priority order):

1. .pw-skills/pw-cover-image/EXTEND.md (project level)
2. ~/.pw-skills/pw-cover-image/EXTEND.md (user level)

Use Cases:

• Corporate brand style
• Custom styles for specific topics
• Override the default style definitions

Prompt Debugging

View the generated prompt file to understand how the system interprets the content.

Location: cover-image/{topic-slug}/prompts/cover.md

Purpose:

• Understand the style selection logic
• Debug generation issues
• Learn prompt writing

Multiple Image Generation Services

If multiple image generation services are configured, the system will ask you to choose.

Selection Suggestions:

• Choose based on service quality and speed
• Different services may produce different styles
• You can try multiple services to compare the results