1实现原理 · 为什么它能做到

能力全部落在两个本地 Python 脚本上（Pillow 画图/缩放），skill 正文的作用是把『问什么、跑哪个脚本、怎么交付』编排成固定流程。

skills/web-asset-generator/SKILL.md

3. **Run the appropriate script(s)**: - Favicons/icons: `scripts/generate_favicons.py` - Social media images: `scripts/generate_og_images.py`

脚本尺寸表是硬编码常量：favicon 16/32/96 + apple-touch-icon 180 + android-chrome 192/512（generate_favicons.py ICON_SIZES/APP_ICON_SIZES），OG 为 og-image 1200x630 / twitter-image 1200x675 / og-square 1200x1200（generate_og_images.py OG_SIZES）。

交互纪律被写成硬要求：所有需求澄清必须走 AskUserQuestion（可视选项），并给出 8 套标准问题模板覆盖资产类型、源材料、平台、配色、图标语义、代码集成与验证。

skills/web-asset-generator/SKILL.md

**IMPORTANT**: Always use the AskUserQuestion tool to gather requirements instead of plain text questions. This provides a better user experience with visual selection UI.

8 套模板（Question Pattern 1-8）分别处理：资产类型、源材料、平台多选、配色、icon 语义、emoji 选择、是否代改代码、是否给验证工具链接——这是该 skill 最大的『非图像』设计量。

图标生成的实质是 Pillow 缩放链：源图转 RGBA 保留透明、LANCZOS 重采样逐尺寸落 PNG，另生成含 16/32 两档的多分辨率 .ico。

skills/web-asset-generator/scripts/generate_favicons.py

icon_16.save(ico_path, format='ICO', sizes=[(16, 16), (32, 32)])

循环体：'resized.save(output_path, 'PNG', optimize=True)'；emoji 模式要求 iOS 不支持透明，故 app 图标走实色背景（SKILL.md: 'For app icons, use solid background (iOS doesn't support transparency)'）。

emoji 路线是本地渲染 + 本地词库推荐：60+ 条带关键词的 emoji 库做打分推荐，选中后用 Pilmoji 把 emoji 画进画布。

skills/web-asset-generator/scripts/emoji_utils.py

# Curated emoji database with keywords for better matching

渲染：'with Pilmoji(img) as pilmoji: … pilmoji.text((x, y), emoji_char, font=None, fill=(0, 0, 0, 0), emoji_scale_factor=emoji_size/64)'；缺 pilmoji 时抛 'pilmoji library is required for emoji rendering. Install it with: pip install pilmoji'。

文字类 OG 图靠字符数决定字号（短 144 / 中 120 / 长 102 / 超长 84）、按宽度换行、logo 限高 20%——即用参数化排版代替做图。

skills/web-asset-generator/scripts/generate_og_images.py

# Medium text: use base size return base_size # 120px elif text_length <= 60: # Long text: reduce slightly return int(base_size * 0.85) # 102px

logo 处理：'max_logo_height = int(size[1] * 0.20)'；图片模式用 fit_mode='cover' 的中心裁剪缩放；输出同样 'img.save(output_path, 'PNG', optimize=True)'。

质量校验是本地纯计算：按平台要求表检查体积/尺寸/比例/格式，文本图另算 WCAG 对比度分级。

skills/web-asset-generator/scripts/lib/validators.py

PLATFORM_REQUIREMENTS = { 'facebook': { 'max_file_size': 8 * 1024 * 1024, # 8MB 'recommended_size': (1200, 630), 'min_size': (600, 315), 'aspect_ratio': 1.91, 'formats': ['png', 'jpg', 'jpeg'], },

对比度用标准相对亮度公式（calculate_contrast_ratio/validate_contrast，AA 4.5:1 / AAA 7.0:1）；结果封装为 ValidationResult（success/warning/error）驱动 SKILL.md 里的 ✓/⚠/❌ 输出规范。

交付环节包含『代改代码』：按用户选择自动探测框架（Next/Astro/SvelteKit/Vue-Nuxt/Gatsby/纯 HTML）→ 找目标文件 → 展示 diff → 用户确认后用 Edit 工具插入 meta/link 标签。

skills/web-asset-generator/SKILL.md

**If user selects "Yes, auto-detect":** 1. Search for framework config files (next.config.js, astro.config.mjs, etc.) 2. Detect framework type

安全约束写在流程里：'Show diff of proposed changes' + 'Insert tags if user confirms'，且 SKILL.md 给 Next.js metadata export / Astro head / 纯 HTML </head> 三种插入范例。

平台规格知识单独成册（references/specifications.md），skill 正文只引用不内嵌，避免把尺寸表塞进每次上下文。

skills/web-asset-generator/SKILL.md

For detailed platform specifications, size requirements, and implementation guidelines, read: - `references/specifications.md`: Comprehensive specs for all platforms

另有 CLAUDE.md（给 AI 开发者的架构说明：脚本职责、字体路径 '/usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf'、emoji 包必须 <2.0.0 等）。

2核心能力

01从 logo 生成完整 favicon/App 图标组（16/32/96 PNG + 多分辨率 ico + 180/192/512 PWA 图标）

02从 emoji 生成图标（含关键词打分推荐 4 个候选 emoji、可选背景色）

03生成社交分享图（OG 1200x630、Twitter 1200x675、方形 1200x1200），支持纯文字/文字+logo/纯 logo 三种模式

04按字符数自动排版（动态字号 + 自动换行 + logo 限高），非设计师用户也能出可用图

05内置校验：体积上限（FB 8MB / Twitter 5MB / favicon 100KB 警告）、尺寸与比例、格式、WCAG 对比度分级

06直接产出可粘贴的 HTML 标签（favicon link 组 + OG/Twitter meta 组）

07框架感知的代码集成（探测 + 目标文件定位 + diff 确认后插入）

08交付后引导外部验证工具（Facebook Debugger / Twitter Card Validator / LinkedIn Post Inspector / opengraph.xyz）

3外部依赖

Kind	Dependency / Endpoint
package	Pillow（PIL，必需）
package	pilmoji（emoji 渲染，可选）
package	emoji（emoji 关键词/版本检测，可选且被检查器要求 <2.0.0）
network	无代码级网络出口；仅在 SKILL.md/references 里给出外部验证工具链接供用户自行访问

4管控建议与判定依据

建议配套管控措施

面向 Agent

分级或逐次授权，建议在沙箱运行

面向管理者

审批流程、可回滚、全程审计

判定依据（文件路径与关键语句摘要）

scripts/: 执行本地脚本或命令: python scripts/generate_favicons.py <source_image> <output_dir> [favicon|ap
scripts/ 或 SKILL.md: 声明动态安装外部语言包依赖
本地工作目录: 文件读写与工件输出: 输出目录下生成 PNG/ICO：favicon-16x16/32x32/96x96.png、favicon.ico、apple-touch-icon.

审计说明： 。按统一分档：本 skill 属『仅本地工具/本地读写』——脚本用 Pillow 在本地生成图片、无网络出口、无凭证读取、无子进程，外部依赖为官方 PyPI 包（Pillow/pilmoji/emoji）。之所以不是绿档：它确实执行 Python 脚本、写本地文件，且在用户确认后会**修改用户代码库文件**（框架自动集成），并有 pip 安装第三方包的前置要求。外发面与凭证面均为零，故不升黄/橙。

5第二遍独立确认

[ok] 『无网络外发』结论 — 5 个脚本逐文件扫描：import 仅 PIL/pilmoji/emoji/colorsys/textwrap/argparse/pathlib/io/sys/os/re；无 requests/urllib/socket/http.client/subprocess/os.system/eval/exec；全目录 URL 仅出现在 SKILL.md 与 references/specifications.md 的文档说明中。
[ok] 『无凭证读取』结论 — 无 os.environ/getenv；check_dependencies.py 只做 try-import 探测并打印 pip 安装建议；仓库无 .env 示例、无 key 常量。
[ok] 尺寸与字号常量与文档一致 — generate_favicons.py ICON_SIZES(16/32/96)+APP_ICON_SIZES(180/192/512)、generate_og_images.py OG_SIZES(1200x630/1200x675/1200x1200)、calculate_font_size 的 1.2/1.0/0.85 倍率（144/120/102/84）与 SKILL.md Best Practices 的文本长度表逐字吻合。
[ok] 校验能力真实落地（非仅文档） — validators.py 定义 PLATFORM_REQUIREMENTS（facebook 8MB/1200x630/1.91、twitter 5MB/1200x675/16:9 等）与 ValidationResult；SKILL.md 给出 --validate 用法与 ✓/⚠/❌ 输出示例，两侧一致。
[ok] emoji 依赖的版本约束 — check_dependencies.py 对 emoji 主版本 <2 判定兼容，否则提示 "Install compatible version: pip install 'emoji<2.0.0'"；CLAUDE.md 重复该约束（'must use version <2.0.0 for pilmoji compatibility'）。属真实存在的第三方兼容性坑，非文档臆造。
[discrepancy] 『会修改用户代码库』的定性与护栏 — 第一遍只按『本地生成图片』记录，第二遍确认 SKILL.md Question Pattern 7 与交付流程明确要求 agent 探测框架（next.config.js/astro.config.mjs/…）并在用户确认后用 Edit 插入标签——这是对用户源码的写入能力。已据此把 file_writes 拆成『脚本产物』与『经确认的宿主编辑』两类，并在 injection_surface/risks 单列；档位维持 blue（写入仍属本地、且有 diff+确认门）。
[ok] 字体路径依赖（跨平台可用性） — CLAUDE.md 记录字体 '/usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf'（回退默认字体）；generate_og_images.py 用 ImageFont 加载，属 Linux 假设，已作为可用性注记写入 verdict.fits/not_for 之外的分析（traits 未夸大跨平台能力）。
[ok] 外部依赖清单完整性 — 依赖仅 Pillow（必需）与 pilmoji/emoji（可选 emoji 路线），全部为 PyPI 官方包；无 CLI 依赖、无镜像源、无远程服务（对比同类 skill 常见的 ffmpeg/imagemagick 依赖，本 skill 无外部二进制）。

6结论

从零到落地的一条链：生成图片 → 校验合规 → 给 HTML 标签 → 探测框架并写进代码库 → 给平台验证链接，用户不需要自己拼装这些步骤。

自动化程度高但不失控：8 套 AskUserQuestion 模板保证先问清楚再动手，改代码前强制展示 diff 并等确认。

自带质量门槛：平台体积/尺寸/比例/格式校验 + WCAG 对比度分级，避免产出『尺寸不对/发不出去/不可读』的社交图。

emoji 路线降低门槛：没 logo 也能做出体面的站点图标，且推荐带关键词解释、可指定背景色，app 图标自动用实色底规避 iOS 透明问题。

零网络零凭证：全部本地处理，不需要任何 key 或第三方服务，适合在不希望外发素材的环境里跑。

适合： 适合：需要快速给站点补齐 favicon/PWA 图标与社交分享图的开发者或独立产品作者；没有 logo、想用 emoji 快速起一个体面图标的小项目；希望生成后顺手把 meta 标签写进 Next.js/Astro/纯 HTML 项目的用户；以及在意『图能不能过 Facebook/Twitter 限制』的运营向场景（可直接跑 --validate）。

不适合： 不适合：需要品牌级视觉设计（渐变/插画/品牌字体/多语言排版）的场景——它是参数化排版工具而非设计工具；无法安装 Pillow 或不让 agent 写文件的受限环境（emoji 路线还需要 pilmoji，输出也需要写盘）；不允许任何自动改写源码的团队（除非全程选手工模式）；以及要求图片可直接用于生产且通过人工设计的用户（生成图仍需人工复核）。

Install Agent-Ready

① Verified Mirror 2026-09-15

Option A · Direct DownloadDownload web-asset-generator.tar.gz

sha256: a6da82bc927a95b8…

Option B · Copy Guide for Agent

install.json

agent 读 JSON 指南后会自动从本站下载安装，无需更多说明。

② Upstream GitHub

GitHub Repo ↗

Pinned to commit c6d56dc54a.