cover-image
Generate article cover images with 5 dimensions (type, palette, rendering, text, mood). Supports cinematic (2.35:1), widescreen (16:9), and square (1:1) aspects. Use when user asks to 'generate cover image', 'create article cover', or 'make cover'.
- Installs
- 82
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/notedit/happy-skills --skill cover-image- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads cover-image automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
Cover Image Generator
Generate elegant cover images for articles with 5-dimensional customization. Supports Chinese text rendering.
Usage
# Auto-select dimensions based on content
/cover-image path/to/article.md
# Quick mode: skip confirmation
/cover-image article.md --quick
# Specify dimensions
/cover-image article.md --type conceptual --palette warm --rendering flat-vector
# WeChat Official Account cover
/cover-image article.md --aspect 2.35:1
# Specify provider
/cover-image article.md --provider qwen
# Use style preset
/cover-image article.md --style tech-dark
# Large font for better visibility
/cover-image article.md --font-size large
# Generate multiple options
/cover-image article.md --n 3
# With reference images (Google/OpenAI only)
/cover-image article.md --ref style-ref.png
# Direct content input
/cover-image --palette mono --aspect 1:1 --quick
[paste content]
Options
| Option | Description |
|---|---|
--type <name> | hero, conceptual, typography, metaphor, scene, minimal |
--palette <name> | warm, elegant, cool, dark, earth, vivid, pastel, mono, retro |
--rendering <name> | flat-vector, hand-drawn, painterly, digital, pixel, chalk |
--text <level> | none, title-only, title-subtitle, text-rich |
--mood <level> | subtle, balanced, bold |
--font <name> | clean, handwritten, serif, display |
--font-size <size> | small, medium (default), large, xlarge |
--aspect <ratio> | 16:9 (default), 2.35:1 (公众号封面), 4:3, 3:2, 1:1, 3:4 |
--provider <name> | qwen (default), openai, google |
--style <preset> | tech-dark, tech-clean, lifestyle-warm, business-elegant, announcement-bold, minimal-zen, creative-playful, retro-vintage |
--lang <code> | Title language (en, zh, ja, etc.) |
--no-title | Alias for --text none |
--n <count> | Number of images to generate (1-4) |
--quick | Skip confirmation, use auto-selection |
--ref <files...> | Reference images for style/composition guidance |
Providers
| Provider | Model | Text Rendering | Chinese Support | Price |
|---|---|---|---|---|
qwen | qwen-image-plus | Excellent | Native Chinese | 0.2 CNY/image |
openai | gpt-image-1 | Good | Limited | ~$0.04/image |
google | gemini-2.0-flash-exp | Good | Limited | Free tier available |
Provider Selection Logic
--providerspecified -> use it- Chinese title detected -> auto-select
qwen - Reference images provided -> use
googleoropenai - Default ->
qwen
Qwen-Image (Default)
Best for Chinese text rendering. Native support for Chinese characters.
API Endpoint: https://dashscope.aliyuncs.com/api/v1/services/aigc/text2image/image-synthesis
Environment Variable: DASHSCOPE_API_KEY
Supported Sizes: 1664*928, 1024*1024, 928*1664, 1472*1104, 1104*1472
OpenAI
Good for English text and creative designs.
Environment Variable: OPENAI_API_KEY
Supported Sizes: 1024x1024, 1536x1024, 1024x1536
Good for multimodal generation with reference images.
Environment Variable: GOOGLE_API_KEY
Supported Sizes: Various aspect ratios supported
Five Dimensions
| Dimension | Values | Default |
|---|---|---|
| Type | hero, conceptual, typography, metaphor, scene, minimal | auto |
| Palette | warm, elegant, cool, dark, earth, vivid, pastel, mono, retro | auto |
| Rendering | flat-vector, hand-drawn, painterly, digital, pixel, chalk | auto |
| Text | none, title-only, title-subtitle, text-rich | title-only |
| Mood | subtle, balanced, bold | balanced |
| Font | clean, handwritten, serif, display | clean |
Auto-selection rules: references/auto-selection.md
Galleries
Types: hero, conceptual, typography, metaphor, scene, minimal -> Details: references/types.md
Palettes: warm, elegant, cool, dark, earth, vivid, pastel, mono, retro -> Details: references/palettes/
Renderings: flat-vector, hand-drawn, painterly, digital, pixel, chalk -> Details: references/renderings/
Text Levels: none (pure visual) | title-only (default) | title-subtitle | text-rich (with tags) -> Details: references/dimensions/text.md
Mood Levels: subtle (low contrast) | balanced (default) | bold (high contrast) -> Details: references/dimensions/mood.md
Fonts: clean (sans-serif) | handwritten | serif | display (bold decorative) -> Details: references/dimensions/font.md
File Structure
Output directory per default_output_dir preference:
same-dir:{article-dir}/imgs-subdir:{article-dir}/imgs/independent(default):cover-image/{topic-slug}/
<output-dir>/
├── source-{slug}.{ext} # Source files
├── refs/ # Reference images (if provided)
│ ├── ref-01-{slug}.{ext}
│ └── ref-01-{slug}.md # Description file
├── prompts/cover.md # Generation prompt
└── cover.png # Output image
Slug: 2-4 words, kebab-case. Conflict: append -YYYYMMDD-HHMMSS
Workflow
Progress Checklist
Cover Image Progress:
- [ ] Step 1: Analyze content + save refs + determine output dir
- [ ] Step 2: Confirm options (6 dimensions + provider) unless --quick
- [ ] Step 3: Create prompt
- [ ] Step 4: Generate image
- [ ] Step 5: Resize for platform (if needed)
- [ ] Step 6: Completion report
Step 1: Analyze Content
- Save reference images (if provided) -> references/workflow/reference-images.md
- Save source content (if pasted, save to
source.md) - Analyze content: topic, tone, keywords, visual metaphors
- Deep analyze references: Extract specific, concrete elements
- Detect language: Compare source, user input
- Determine output directory: Per File Structure rules
- Auto-select provider: Based on language and references
Step 2: Confirm Options
Full confirmation flow: references/workflow/confirm-options.md
| Condition | Skipped | Still Asked |
|---|---|---|
--quick | 6 dimensions + provider | Aspect ratio (unless --aspect) |
All 6 + --aspect + --provider specified | All | None |
Step 3: Create Prompt
Save to prompts/cover.md. Template: references/workflow/prompt-template.md
CRITICAL - References in Frontmatter:
- Files saved to
refs/-> Add to frontmatterreferenceslist - Style extracted verbally (no file) -> Omit
references, describe in body - Before writing -> Verify:
test -f refs/ref-NN-{slug}.{ext}
Reference elements in body MUST be detailed, prefixed with "MUST"/"REQUIRED", with integration approach.
Step 4: Generate Image
- Backup existing
cover.pngif regenerating - Select provider based on language and options
- Process references from prompt frontmatter:
directusage -> pass reference images directly (google/openai only)style/palette-> extract traits, append to prompt
- Generate via provider API:
- Qwen: POST to dashscope API, poll for result
- OpenAI: Use ImageGen tool or API
- Google: Use ImageGen tool with reference images
- On failure: auto-retry once
Step 5: Resize for Platform
Resize generated image to target platform size:
| Platform | Target Size | Aspect Ratio |
|---|---|---|
| 公众号封面 | 900x383 | 2.35:1 |
| 博客/视频 | 1920x1080 | 16:9 |
| 小红书 | 1080x1080 | 1:1 |
| 手机海报 | 1080x1440 | 3:4 |
Step 6: Completion Report
Cover Generated!
Provider: [provider]
Topic: [topic]
Type: [type] | Palette: [palette] | Rendering: [rendering]
Text: [text] | Mood: [mood] | Font: [font] | Aspect: [ratio]
Title: [title or "visual only"]
Language: [lang]
References: [N images or "extracted style" or "none"]
Location: [directory path]
Files:
- source-{slug}.{ext}
- prompts/cover.md
- cover.png
- cover-{platform}.png (if resized)
Composition Principles
- Whitespace: 40-60% breathing room
- Visual anchor: Main element centered or offset left
- Characters: Simplified silhouettes; NO realistic humans
- Title: Use exact title from user/source; never invent
Aspect Ratios
| Ratio | Platform | Use Case |
|---|---|---|
2.35:1 | 微信公众号封面 | 公众号首图，900x383px |
16:9 | 通用宽屏 | 博客、视频封面 |
1:1 | 社交媒体 | 微博、小红书、Instagram |
4:3 | 经典比例 | 演示文稿、传统媒体 |
3:2 | 摄影标准 | 照片风格封面 |
3:4 | 竖版 | 手机端、海报 |
Environment Variables
| Variable | Required For | Get From |
|---|---|---|
DASHSCOPE_API_KEY | Qwen (default) | https://bailian.console.aliyun.com |
OPENAI_API_KEY | OpenAI | https://platform.openai.com |
GOOGLE_API_KEY | https://aistudio.google.com |
References
Dimensions: text.md | mood.md | font.md Palettes: references/palettes/ Renderings: references/renderings/ Types: references/types.md Style Presets: references/style-presets.md Auto-Selection: references/auto-selection.md Visual Elements: references/visual-elements.md Workflow: confirm-options.md | prompt-template.md | reference-images.md | qwen-api.md
FAQ
What does the cover-image skill do?
Generate article cover images with 5 dimensions (type, palette, rendering, text, mood). Supports cinematic (2.35:1), widescreen (16:9), and square (1:1) aspects. Use when user asks to 'generate cover image', 'create article cover', or 'make cover'.
How do I install cover-image?
Run npx skills add https://github.com/notedit/happy-skills --skill cover-image in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/cover-image/ (personal) or .claude/skills/cover-image/ (project).
Which AI agents can use cover-image?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is cover-image safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains cover-image?
It is published by notedit in notedit/happy-skills. It has 82 recorded installs.
More from notedit/happy-skills
feature-dev
notedit/happy-skills
Guided feature development with codebase understanding and architecture focus. Use for implementing features systematically: explore → clarify → design → implement → test → review.
gsap-animation
notedit/happy-skills
GSAP + Remotion integration for professional motion graphics video production. Timeline orchestration, text splitting, SVG morphing, advanced easing, and reusable effect presets.
screenshot-analyzer
notedit/happy-skills
Analyze product screenshots to extract feature lists and generate development task checklists. Use when: (1) Analyzing competitor product screenshots for feature extraction, (2) Generating PRD/task lists from UI designs, (3) Batch analyzing multiple app screens, (4) Conducting competitive analysis from visual references.
react-animation
notedit/happy-skills
ReactBits animations for Remotion - curated for aesthetic excellence in video production
video-producer
notedit/happy-skills
End-to-end Remotion video production from natural language briefs. Orchestrates narrative structure, scene animation, visual style, and rendering to produce complete promotional videos. Use when a user wants to create a complete video (product promo, typographic piece, social media animation) — not just individual animation effects. Coordinates gsap-animation, spring-animation, and react-animation skills as building blocks.
feature-analyzer
notedit/happy-skills
Turn ideas into fully formed designs and specs through natural collaborative dialogue. Use when planning new features, designing architecture, or making significant changes to the codebase.
Popular media & creative skills
hyperframes
heygen-com/hyperframes
Read first to make, edit, animate or render any video with HyperFrames (HTML rendered to video), including launch films, explainers, music videos, charts, maps, vertical clips, title cards, captions and overlays. Holds the render contract, the work loop and what each kind of video needs.
media-use
heygen-com/hyperframes
Get or make any media for a HyperFrames video - music, sound effects, images, icons, logos, voiceover, avatar and generated video, transcripts, cutouts, colour grades and looks - with HeyGen or free local tools, and mix placed audio. Also for footage that looks dark, flat or dull, or should be stylized or hidden.
hyperframes-registry
heygen-com/hyperframes
About 450 ready-made HyperFrames blocks and components installed as editable source - transitions, overlays, titles, kinetic type, captions, charts, map overlays, 3D, camera moves. Use it before hand-building any named visual (CRT scanlines, glitch, film grain, a chart); also for hyperframes add and catalog.
hyperframes-creative
heygen-com/hyperframes
Non-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use hyperframes-animation.
ai-video-generation
101-skills/superpowers
Generate AI videos with Google Veo, Seedance 2.0, HappyHorse, Wan, Grok and 40+ models via inference.sh CLI. Models: Veo 3.1, Veo 3, Seedance 2.0, HappyHorse 1.0, Wan 2.5, Grok Imagine Video, OmniHuman, Fabric, HunyuanVideo. Capabilities: text-to-video, image-to-video, reference-to-video, video editing, lipsync, avatar animation, video upscaling, foley sound. Use for: social media videos, marketing content, explainer videos, product demos, AI avatars. Triggers: video generation, ai video, text to video, image to video, veo, animate image, video from image, ai animation, video generator, generate video, t2v, i2v, ai video maker, create video with ai, runway alternative, pika alternative, sora alternative, kling alternative, seedance, happyhorse
ai-image-generation
101-skills/superpowers
Generate AI images with GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve and 50+ models via inference.sh CLI. Models: GPT-Image-2, FLUX Dev LoRA, FLUX.2 Klein LoRA, Gemini 3 Pro Image, Grok Imagine, Seedream 4.5, Reve, ImagineArt. Capabilities: text-to-image, image-to-image, inpainting, LoRA, image editing, upscaling, text rendering. Use for: AI art, product mockups, concept art, social media graphics, marketing visuals, illustrations. Triggers: flux, image generation, ai image, text to image, stable diffusion, generate image, ai art, midjourney alternative, dall-e alternative, text2img, t2i, image generator, ai picture, create image with ai, generative ai, ai illustration, grok image, gemini image, gpt image, openai image, chatgpt image