web-asset-generator

用途

Web Asset Generator 用于从 logo 图片、emoji 或文字标语生成网站所需的各类资源文件，包括 favicon、PWA 应用图标以及社交媒体分享预览图（Open Graph 图片），并可辅助将这些资源对应的 HTML 标签接入代码库。

Favicon 生成：输出 favicon-16x16.png、favicon-32x32.png、favicon-96x96.png 以及多分辨率的 favicon.ico。
PWA 应用图标生成：输出 apple-touch-icon.png（180x180）、android-chrome-192x192.png、android-chrome-512x512.png。
社交媒体分享图生成：输出 og-image.png（1200x630，适用于 Facebook、WhatsApp、LinkedIn）、twitter-image.png（1200x675）以及 og-square.png（1200x1200 方形变体）。
多种素材来源：支持 logo 图片、emoji 字符和文字/标语三种来源；文字方案可配合 logo 叠加。
Emoji 智能建议：根据项目描述返回 4 个 emoji 建议供选择。
HTML 标签输出：脚本自动生成对应的 link 与 meta 标签。
代码集成：可自动检测框架并定位目标文件，或以用户指定路径插入标签。
预览测试链接：提供 Facebook、Twitter、LinkedIn 及通用 OG 校验工具的链接。

安装与使用以 Python 脚本调用为主。

从 logo 生成 favicon 和应用图标：

python scripts/generate_favicons.py <source_image> <output_dir> [icon_type]

icon_type 可选 favicon、app 或 all（默认 all）。

获取 emoji 建议：

python scripts/generate_favicons.py --suggest "coffee shop" /home/claude/output all

使用选定 emoji 生成图标：

python scripts/generate_favicons.py --emoji "☕" <output_dir> [icon_type] [--emoji-bg COLOR]

生成社交媒体分享图（来自 logo）：

python scripts/generate_og_images.py <output_dir> --image <source_image>

生成社交媒体分享图（来自文字）：

python scripts/generate_og_images.py <output_dir> --text "Your text here" [options]

文字方案可选参数包括 --logo <path>、--bg-color <color>（默认 '#4F46E5'）、--text-color <color>（默认 'white'）。

交付时可将输出文件从 /home/claude/output/ 复制到 /mnt/user-data/outputs/。

该技能会通过 AskUserQuestion 交互式收集需求，包括资源类型、素材来源、平台选择、颜色偏好、emoji 选择、是否集成代码以及是否测试预览链接等。