Agent Skills
返回列表
🎨

网页应用图标与社交资产生成器

设计多媒体 更新于 2026.08.30

将以下提示词粘贴到你的 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 应用图标和分享预览图,避免遗漏平台要求。