skills.guanliai
How-tosAll SkillsCombos
中EN
How-tosAll SkillsCombos

skills.guanliai.com

An AI how-to library organised by scene: which skills to use, how to install, how to prompt, and what traps to avoid.

How-tosAll SkillsCombos

Supported clients

  • Claude Code
  • Cline / Roo Code
  • CodeBuddy
  • CodeGeeX (Zhipu)
  • Comate (Baidu)
  • Cursor
  • Fitten Code
  • Gemini CLI
  • GitHub Copilot
  • Kiro
  • Lingma (Alibaba)
  • MarsCode
  • OpenAI Codex
  • OpenClaw
  • OpenCode
  • Qoder
  • Tencent CloudBase AI
  • Trae
  • VS Code
  • Windsurf
skills.guanliai.com · Agent Skill DirectoryData from GitHub · Next.js + MySQL
HomeGuidesDesign & VisualGenerate icons and article illustrations with AI

Generate icons and article illustrations with AI

Updated 2026-10-11 15 分钟(含改稿) Difficulty ★★☆☆☆Author Skills 编辑部

Skills used in this guide (3)

  • icon-generatoricon-generatorPrimary Installable

    网页与数字界面设计师和平面设计师在开发App、网页或设计UI界面时,当需要快速产出高质量Icon,使用此技能即可一键生成多尺寸、风格统一的标准图标,彻底解决图标设计耗时痛点,大幅提升视觉交付效率!

    Download pack → https://github.com/anbeime/skill/tree/main/skills/icon-generator
  • pop-up-book-illustrationpop-up-book-illustrationSupporting Installable

    平面设计师与内容创作者在制作科技、教育或品牌视觉物料时,一键生成融合纸质手工质感与数字科技光效的3D弹出书风格插画。

    Download pack → https://github.com/anbeime/skill/tree/main/skills/pop-up-book-illustration/pop-up-book-illustration
  • baoyu-article-illustratorbaoyu-article-illustratorSupporting

    文章配图生成,保证类型 × 风格 × 配色的一致性。

    npx skills add NousResearch/hermes-agent -g

The pain of illustration isn't "can't draw" — it's "inconsistent style, blurry when scaled, can't edit". The point of AI vector illustration: set style and size first, want vector not bitmap, so it scales sharp and the source stays editable.

Who this is for / not for

For:

  • Need a consistent set of icons / illustrations
  • Want vector (SVG) for web / PPT, sharp when scaled
  • Want editable source output

Not for:

  • Photo-realistic images (that's an image model, not SVG)
  • Brand-level retouch (AI is structure/style first)
  • One-off image, don't care about consistency

Before you start

  1. Use: icon set / article art / cover — decides ratio & style.
  2. Style ref: 2-3 refs or description (flat / line / papercraft).
  3. Size: icon 24/48, illustration 16:9 or 1:1.

Steps

1. Install the skill

icon-generator is an icon-generation skill (runs locally). Copy its folder into your client's skills directory (same as any Agent Skill):

ClientDirectory
Claude Code~/.claude/skills/
Codex~/.codex/skills/
Cursor~/.cursor/skills/
Trae~/.trae/skills/
CodeBuddy~/.codebuddy/skills/
Tongyi Lingma~/.lingma/skills/

2. Set style, then batch

text
Generate a "data analysis" icon set, 12 icons, consistent style:
linear, 1.5px stroke, rounded, 24x24 viewBox, single color #2563eb.
Each expresses one concept (trend/funnel/pie/table…).
Give 1 style sample to confirm, then batch the rest.

3. Article art, different style

Blog/newsletter art with baoyu-article-illustrator, describe mood and subject:

text
Illustration for an article on "remote work productivity": warm, human silhouette, flat vector,
laptop + plant as subject, 16:9, SVG.

4. Cover with papercraft

Cover/card with pop-up-book-illustration for a 3D papercraft look that pops more.

Pitfalls

PitSymptomFix
InconsistentSet looks multi-authoredConfirm 1 sample, then batch
Blurry bitmapScales fuzzyWant SVG vector, not PNG
Can't editBitmap, no sourceKeep SVG source, edit paths
Too loudInfo buriedMono/two-color, accent one spot
Wrong ratioDistorts on pasteFix viewBox ratio upfront

FAQ

Consistent icon set?

Yes — have AI give 1 sample to confirm, then batch with same params; safest.

Sharp when scaled?

Must be SVG vector; PNG always blurs when scaled.

Article art style?

Blog/newsletter → baoyu style; bolder cover → papercraft.

Edit generated image?

Keep SVG source; editing paths/colors beats redraw.

No design draft?

Yes — give style ref or text; more specific ref → more accurate.

Related guides

Continue across these scenes:

  • Turn the architecture in your head into a diagram with AI
  • Generate illustrations and marketing images with AI

相关源码

  • anbeime/skill · icon-generator source
  • anbeime/skill · pop-up-book-illustration source
  • NousResearch/hermes-agent · baoyu-article-illustrator source
  • Agent Skill open format spec

一句话结论

结论:配图要矢量不要位图——先定风格样张再批量,SVG 放大不糊还能改源文件。

References

  • anbeime/skill · icon-generator 源码
  • anbeime/skill · pop-up-book-illustration 源码
  • NousResearch/hermes-agent · baoyu-article-illustrator 源码
  • Agent Skill 开放格式规范

Related Scenes

Design & Visual

Generate illustrations and marketing images with AI

The worst text-to-image is "one-line prompt, pure luck". The point: set style ref + subject + composition + ratio as structured prompt, then iterate small — not throw "draw something nice" and hope.

★☆☆☆☆ 15 分钟(含改提示词)3 skills
Design & Visual

Make podcast scripts and voiceover with AI

The pain of podcast/talking-head isn't "no voice" — it's "script reads like a paper, voice sounds robotic, nobody finishes". The point of AI: write the script as spoken human language, pick a natural voice, then decide on visuals — don't pile effects upfront.

★★☆☆☆ 20 分钟(含配音)3 skills
Design & Visual

Brainstorm and mind-map with AI

The worst brainstorming is "diverge and stop". The point of AI help: first force enough candidates (quantity before quality), then converge on 3 doable ones by "feasibility / impact" — not stop at "many ideas".

★☆☆☆☆ 12 分钟3 skills
Design & Visual

Turn the architecture in your head into a diagram with AI

The pain of diagramming isn't "can't draw" — it's that edits are exhausting: change one box and you re-layout the whole thing. Generating descriptive, re-flowable diagrams turns "drawing" into "describing structure"; editing text is 10x faster than editing the picture.

★☆☆☆☆ 10 分钟4 skills

Contents

  • Who this is for / not for
  • Before you start
  • Steps
  • 1. Install the skill
  • 2. Set style, then batch
  • 3. Article art, different style
  • 4. Cover with papercraft
  • Pitfalls
  • FAQ
  • Consistent icon set?
  • Sharp when scaled?
  • Article art style?
  • Edit generated image?
  • No design draft?
  • Related guides
  • 相关源码
  • 一句话结论