Generate icons and article illustrations with AI
Skills used in this guide (3)
网页与数字界面设计师和平面设计师在开发App、网页或设计UI界面时,当需要快速产出高质量Icon,使用此技能即可一键生成多尺寸、风格统一的标准图标,彻底解决图标设计耗时痛点,大幅提升视觉交付效率!
Download pack → https://github.com/anbeime/skill/tree/main/skills/icon-generator平面设计师与内容创作者在制作科技、教育或品牌视觉物料时,一键生成融合纸质手工质感与数字科技光效的3D弹出书风格插画。
Download pack → https://github.com/anbeime/skill/tree/main/skills/pop-up-book-illustration/pop-up-book-illustration文章配图生成,保证类型 × 风格 × 配色的一致性。
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
- Use: icon set / article art / cover — decides ratio & style.
- Style ref: 2-3 refs or description (flat / line / papercraft).
- 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):
| Client | Directory |
|---|---|
| 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
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:
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
| Pit | Symptom | Fix |
|---|---|---|
| Inconsistent | Set looks multi-authored | Confirm 1 sample, then batch |
| Blurry bitmap | Scales fuzzy | Want SVG vector, not PNG |
| Can't edit | Bitmap, no source | Keep SVG source, edit paths |
| Too loud | Info buried | Mono/two-color, accent one spot |
| Wrong ratio | Distorts on paste | Fix 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
Related Scenes
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.
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.
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".
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.