网页应用图标与社交资产生成器
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_3c6cb52e/generate-launch-ready-web-app-icons-and-social-assets-with-web-asset-generator 技能到 AI 助手中。
技能介绍
要解决的问题
网页应用上线前,团队通常要补齐 favicon、app icon 和社交预览图,并分别适配浏览器标签、桌面/移动设备、分享卡片等位置。手工导出多尺寸图片、命名和整理目录容易遗漏,也会让发布流程卡在资产准备上。
技能如何工作
该技能面向需要快速得到一套发布候选资产的工程场景:只要提供 源 logo、文字提示 或 emoji 概念,就可以让 Claude Code 继续生成完整资源集,并给出 集成提示,减少手动导出与对齐工作。它围绕网页应用图标和社交预览资产展开,核心目标是把“有图标”推进到“能启动、能分享、能预览”。
关键步骤
- 明确目标站点或应用的资产需求,以及视觉来源:logo、文字 prompt 或 emoji。
- 让
Claude Code生成favicon、app icon、社交预览图等所需资源。 - 接收完整资源集与集成提示,再放到网页项目的约定位置。
- 用源 logo/prompt/emoji 做替换,而不是依赖某一套固定成品图。
适用边界与注意点
运行前提包括 Claude Code 2.0.13 或更高版本、已安装 Pillow 的 Python 环境,以及可选的 emoji 相关依赖;上游资料还提到 Python 3.6+ 与 pip 环境。emoji 链路涉及 pilmoji 和 emoji<2.0.0,属于可选依赖,失败时不应假设 emoji 路径一定可用。资料未说明所有平台尺寸的完整规范,因此实际发布前仍需按目标平台核对最终尺寸与显示效果。
使用场景
- 网页项目上线前,需要从现有 logo 生成 favicon、应用图标和社交分享预览图,并整理成可提交的目录。
- 已有品牌 emoji 或文字概念,想直接生成一套可放进仓库的网页应用图标与社交预览资产,减少逐张导出。
- 要把网页应用提交到浏览器、桌面或社交平台,需要快速产出多尺寸预览资产,并在项目里说明放置位置。
- 设计稿还没定稿,但想先用 logo 或 prompt 生成启动候选图标集,后续再替换源文件重新产出。
适合人员
- 独立全栈工程师:希望用脚本或 Claude Code 从 logo/prompt 快速生成发布用 favicon、app icon 和社交预览资源包。
- 初创产品负责人:需要在没有专职设计师的情况下,把网页应用图标和社交预览资产尽快放进版本库。
- 单人项目维护者:不想逐张处理多尺寸图片,希望通过统一流程生成完整资源集并得到放置提示。
- 独立应用开发者:有 logo 或 emoji 概念,想生成可启动的 Web 应用图标和分享预览图,避免遗漏平台要求。