给新产品配一枚专业 Logo，传统做法要么花预算找设计师，要么用文生图模型反复抽卡，得到的位图难以修改、也拿不到矢量源文件。Logo Generator Skill 把 Logo 设计变成 Agent 的一项技能：它基于产品信息一次性生成六套以上纯 SVG 矢量方案，配合交互式对比网页供你挑选迭代，定稿后一条命令即可导出包含 SVG 多版本、多尺寸透明 PNG、ICO 网站图标在内的完整品牌资产包。整个流程纯离线运行，不依赖任何 API Key。本教程讲解这款 Skill 的安装配置与完整使用流程，并以音频产品 eolisten 的真实设计过程为案例，帮助你在自己的 Agent 中用对话的方式完成 Logo 设计。
前置教程
如想快速开始学习本教程，你可能需要先完成以下前置教程：
- DeepSeek Harness等Agent Skill安装与应用教程，详解 Skill 的目录结构、项目级与全局级配置方式，本教程的安装步骤沿用其中的方法。
- Skill概念详解，介绍 Skill 的基本概念与工作机制，帮助理解本教程中技能的触发与执行方式。
- Git的安装与基本使用教程，用于通过 git clone 获取技能源码。
- WSL2、Ubuntu与Conda安装教程，提供 Python 环境管理基础，本教程使用 Conda 为技能创建专用环境。
资源下载
- logo-generator-v2.zip 技能源码下载，公开链接、永久有效、无提取码。解压后得到
logo-generator文件夹，内含 SKILL.md、参考文档与脚本，为本教程配套的多格式交付优化版（含 Chrome 渲染回退与export_logo.py导出脚本）。 - op7418/logo-generator-skill GitHub 仓库，技能原始开源仓库，MIT 协议，可获取上游原始版本。
1. Logo Generator Skill 是什么
1.1 技能简介
Logo Generator Skill 是社区开发者 op7418（歸藏）开源的 Logo 设计技能，遵循 MIT 协议。它把专业 Logo 设计的经验沉淀为技能文档：极致简洁（最多一到两个核心元素）、慷慨留白（至少四成空白画布）、精准比例（线条粗细 2.5 到 4 像素）、单一视觉焦点。Agent 在这些约束下直接书写 SVG 代码，因此整套设计过程有如下特点：
- 纯代码生成矢量图：Logo 由 Agent 直接编写 SVG 代码产生，全程不需要调用任何外部 API，也没有任何费用。
- 一次给足六个方案：每个需求生成六个以上风格明显不同的设计变体，每个变体附设计理由，避免在单一方向上反复拉扯。
- 可编辑、可无损缩放：SVG 是矢量格式，统一使用
viewBox="0 0 100 100"坐标系与currentColor颜色变量，改颜色、改粗细只需改一处代码。 - 多格式一步交付：定稿后一条命令导出完整品牌资产包——三版 SVG（品牌色、黑色、白色）、四种尺寸透明底 PNG、含多尺寸的 ICO 网站图标，外加一页交付预览网页。
1.2 四阶段工作流程
技能内部定义了四个执行阶段，Agent 会按顺序推进：
| 阶段 | 做什么 |
|---|---|
| 信息收集 | 询问产品名、行业、核心概念、风格偏好 |
| SVG方案生成 | 生成六套以上方案与交互式对比网页 |
| 迭代优化 | 筛选方案、调整参数、组合元素、更换配色 |
| 多格式导出交付 | 运行导出脚本，产出 SVG、PNG、ICO 资产包 |
四个阶段全部在本地完成，不需要联网，也不需要配置任何 API 密钥。
1.3 与其他 Logo 制作方式对比
| 特性 | 传统设计师 | 通用文生图模型 | Logo Generator Skill |
|---|---|---|---|
| 输出格式 | 矢量源文件 | 位图 | 矢量 SVG 加多格式位图 |
| 修改成本 | 需再次沟通 | 重新生成，无法局部修改 | 改参数即可精确调整 |
| 方案数量 | 按报价而定 | 逐张生成 | 一次六套以上 |
| 费用 | 数千到数万元 | 按 Token 或次数计费 | 零费用 |
| 周期 | 数天到数周 | 分钟级 | 分钟级 |
2. 安装与配置
2.1 获取技能并放入技能目录
有两种获取方式，效果一致。方式一是从资源下载区获取 logo-generator-v2.zip，解压得到 logo-generator 文件夹；方式二是用 Git 克隆上游仓库的原始版本：
git clone https://github.com/op7418/logo-generator-skill.git logo-generator
接下来把整个 logo-generator 文件夹放入你所用 Agent 的技能目录。常见 Agent 的技能目录如下：
| Agent | 项目级目录 | 全局级目录 |
|---|---|---|
| DSH（DeepSeek Harness） | .dsh/skills/ |
~/.dsh/skills/ |
| Claude Code | .claude/skills/ |
~/.claude/skills/，Windows 为 %USERPROFILE%\.claude\skills\ |
| ZCode | .zcode/skills/ |
~/.zcode/skills/ |
以在项目级安装为例，把文件夹拷入对应目录即可：
cp -r logo-generator .dsh/skills/
其余 Agent 的技能目录位置与项目级、全局级的取舍原则，参见前置教程DeepSeek Harness等Agent Skill安装与应用教程中的对照表。放入项目级目录后，只有该项目能使用此技能；放入全局级目录则对所有项目生效。
2.2 安装 Python 依赖（可选）
技能的核心设计流程不需要任何 Python 依赖；导出脚本用到的依赖按需安装即可。推荐为技能创建独立的 Conda 环境：
conda create -n logo-generator python=3.10
conda activate logo-generator
uv pip install -r requirements.txt
未安装 uv 时，把最后一条命令换成 pip install -r requirements.txt 即可，uv 的安装与用法可以参考Python环境管理详解与UV的安装与使用教程。依赖清单只有两项：
| 依赖包 | 用途 | 是否必需 |
|---|---|---|
Pillow |
导出 ICO 网站图标 | 生成 ICO 时必需 |
cairosvg |
SVG 渲染后端 | 可选，装不上不影响使用 |
cairosvg在 Windows 上可能因缺少原生动态库而安装后无法使用，这不影响任何功能：PNG 渲染脚本会自动回退到本机 Chrome 无头截图，详见 4.3 节。
2.3 验证安装
重启 Agent 会话，在对话中输入：
/logo-generator
技能被正确识别后，Agent 会介绍自身能力并开始询问你的产品信息。你也可以不敲命令，直接用自然语言说"为我的产品设计一个 Logo"来触发。
3. 实战：为音频产品 eolisten 设计 Logo
下面以音频方向的产品 eolisten 为例，完整走一遍四个阶段。整个过程在 Agent 对话中完成，你只需要用自然语言回应。
3.1 阶段一：描述产品需求
技能被触发后会依次询问产品名、行业、核心概念与风格偏好。一次性把信息说清楚可以减少来回追问：
为我的音频产品 eolisten 设计 Logo。
行业方向是录音、转写与声音管理工具。
核心概念是"声音进来，记录出去"，强调倾听与留声。
风格偏好极简、黑白灰、几何感，不要复杂装饰。
核心概念是整个设计的锚点，越具体越好。"连接、流动、安全、倾听"这类抽象词技能都能转化成对应的视觉母题，例如波形、点阵、留声机形态等。
3.2 阶段二：获取六套方案
技能随后输出六套风格明显不同的 SVG 方案，每套包含方案名、范式类型与设计理由，并生成一个可交互的 HTML 对比网页。在 eolisten 的实战中，技能一次给出了六个方向：留声号角（纯几何）、声纹律动（胶囊矩阵）、声起文成（波形转文字）、倾听声呐（点阵声呐）、e·留声（字母标记）、留声圆匣（容器封存），六套方案覆盖了从具象到抽象、从单元素到组合的不同路线：
每套方案都会说明设计逻辑，例如"e·留声"取 eolisten 的首字母 e，用几何重构让开口的圆弧与波形相连；"倾听声呐"取 listen 中"倾听"的含义，用疏密排列的圆点表达声音的扩散。这些理由能帮你快速判断哪个方向与产品气质匹配。
3.3 阶段三：筛选与迭代
从六套中挑出两三套继续细化，用自然语言描述调整需求即可：
我选"留声号角"和"声纹律动"继续。
号角的喇叭口再圆润一点，两道声波弧的间距拉大。
声纹律动的七根圆头声条改为高低对称排布，边缘两根透明度降低。
把两版的黑白稿各出一版主题色为 #16baaa 的配色。
技能支持缩小方案范围、调整大小间距旋转等参数、组合不同方案的元素、更换配色与渐变、追加探索某个方向的新变体。调整会精确落在你指定的元素上，已满意的部分保持原样。
3.4 阶段四：多格式导出交付
定稿后，把选定的 SVG 保存为文件，告诉技能品牌色，然后运行导出脚本（技能通常会自动代劳）：
python scripts/export_logo.py mark.svg --color "#16baaa" --name eolisten
一条命令跑完，得到如下资产包：
| 交付文件 | 说明 |
|---|---|
eolisten.svg |
品牌色矢量源文件，currentColor 已解析为品牌色 |
eolisten-black.svg |
黑色单色版，用于浅色背景 |
eolisten-white.svg |
白色单色版，用于深色背景 |
eolisten-256/512/1024/2048.png |
四种尺寸的透明底位图 |
eolisten.ico |
网站图标，内含 16 到 256 px 多种尺寸 |
preview.html |
交付预览页，汇总展示全部资产 |
导出脚本还支持调整输出目录（--out-dir）等参数，完整用法可查看 scripts/export_logo.py。生成的 PNG 可直接用作应用图标、公众号头像、PPT 配图，ICO 直接用于网站 favicon，SVG 则适合官网、印刷等一切需要矢量图的场合。
3.5 交付效果
下图是导出脚本自动生成的交付预览页（以六方案中的"留声号角"为例）：上排为品牌色、黑色、白色三版 Logo 在浅色底与深色底下的效果，下排为四种尺寸的透明底 PNG：
4. 使用技巧与原理
4.1 技能目录结构与渐进式披露
理解目录结构有助于你按需改造技能。技能的文件分为三层：
| 文件或目录 | 作用 | 加载时机 |
|---|---|---|
SKILL.md |
主指令：工作流程、设计原则、SVG 规范 | 会话启动时仅加载摘要，触发后加载全文 |
references/design_patterns.md |
设计范式库：点阵、线条、混合构图 | 按需阅读，用到才读 |
assets/showcase_template.html |
方案对比页模板 | 生成对比网页时使用 |
scripts/ |
SVG 转 PNG、多格式导出两个脚本 | 阶段四调用 |
这套"主文档加按需参考"的结构是 Skill 的典型设计：触发时只注入核心指令，大体量的设计范式放在 references/ 中延迟加载，避免占用上下文。
4.2 直接修改 SVG 源码
技能产出的 SVG 遵循统一规范：viewBox="0 0 100 100" 坐标系、currentColor 颜色变量、语义化分组。下面是一个典型的方案片段：
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<g>
<circle cx="50" cy="38" r="18" fill="none" stroke="currentColor" stroke-width="3"/>
<circle cx="50" cy="38" r="6" fill="currentColor"/>
<path d="M 30 72 Q 50 62, 70 72" stroke="currentColor" stroke-width="3" fill="none"/>
</g>
</svg>
由于颜色统一走 currentColor，把 Logo 换成任意品牌色只需在引用处设置 color，或在导出时用 export_logo.py 的 --color 参数指定，源文件本身无需改动。
4.3 Windows 下的渲染回退机制
cairosvg 在 Windows 上依赖 cairo 原生动态库，缺少该库时会导入失败。本教程资源区提供的 svg_to_png.py 做了兼容处理：优先尝试 cairosvg，失败后自动回退到本机 Chrome 的无头截图渲染，透明背景与渲染精度不受影响，只需电脑装有 Chrome 浏览器。两个渲染器对使用者完全透明，命令与输出没有区别。
4.4 按需扩展导出能力
资产包的内容由 scripts/export_logo.py 控制，结构清晰，方便按需求扩展：想增加新的 PNG 尺寸，修改脚本中的 PNG_SIZES 列表即可；想输出 PDF 或 WebP 格式，在渲染循环中追加对应逻辑即可。导出脚本的渲染能力来自 svg_to_png.py，两者通过函数调用衔接。
5. 总结
5.1 核心内容回顾
- Logo Generator Skill 是一款开源的 Agent Logo 设计技能，四阶段流程覆盖信息收集、方案生成、迭代与多格式交付。
- 全程纯离线运行，不需要任何 API Key，也没有任何调用费用。
- 安装只需两步：把技能文件夹放入 Agent 技能目录、按需安装 Python 依赖。
- 一次导出即得完整品牌资产包：三版 SVG、四种尺寸透明 PNG、多尺寸 ICO 网站图标与交付预览页。
- Windows 上 SVG 转 PNG 会自动回退 Chrome 无头渲染，无额外配置成本。
5.2 常见问题与解答
问：完全不联网、不配 API Key 能正常使用吗？
答：能。方案生成、对比网页、迭代调整、多格式导出全部在本地完成，唯一的联网场景是安装技能源码与 Python 依赖。
问：没有安装 Chrome，PNG 能导出吗？
答：能，但建议安装。脚本优先使用 cairosvg 渲染；若 cairosvg 在 Windows 上因缺少原生库不可用，则回退到 Chrome 无头截图。两者都没有时 PNG 环节会失败，SVG 交付不受影响。
问：生成的 Logo 能否用于商业产品？
答：技能源码遵循 MIT 协议，可自由使用；产出的 SVG 归使用者所有。将 Logo 用于商业产品前，建议自行完成商标近似检索等常规确认。
问：多个 Agent 都想用这个技能怎么办？
答：把同一个 logo-generator 文件夹分别拷贝到各 Agent 的技能目录即可，SKILL.md 格式与调用语法通用。目录对照参见前置教程DeepSeek Harness等Agent Skill安装与应用教程。
举手提问