ChromeExtensionIconsSkill

一键生成Chrome扩展所需的全套图标,并自动更新配置文件。

安装使用

复制下面这段提示词发给你的 AI(Claude / Cursor / TRAE / Codex / WorkBuddy 等),它会自动帮你完成安装:

帮我安装这个 AI Skill:ChromeExtensionIconsSkill。
它的用途是:一键生成Chrome扩展所需的全套图标,并自动更新配置文件。
完整的 Skill 内容见:https://321skill.com/skills/chromeextensioniconsskill/raw/index.md
请读取该页面内容,如果是 SKILL.md 格式直接安装,如果是 README 提炼核心 prompt 后安装。

提示词包含完整的 Skill 内容链接,AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。

使用示例

“我的Chrome扩展需要一个书签图标,主色调用#4285F4。”,它会自动从海量图标库中搜索匹配的书签图标,询问你确认样式,然后生成四种尺寸的蓝色书签PNG图标,并更新你项目中的manifest.json文件。

介绍

开发Chrome扩展时,图标准备是项繁琐的工作:需要寻找合适的图标、手动调整成16x16、32x32、48x48、128x128四种尺寸的PNG文件,并正确配置到manifest.json中。这个过程耗时且容易出错。

这个Skill将整个过程自动化。你只需通过自然语言告诉AI你的需求(例如“需要一个日历图标”),它便会从超过27.5万个免费图标库中搜索,自动下载并生成所有必需尺寸的PNG文件,同时更新项目中的manifest.json文件,整个过程通常在几秒内完成。

它非常适合前端开发、全栈开发以及任何需要创建或维护浏览器扩展的开发者。对于UI设计师或产品经理来说,它也能快速生成原型所需的图标素材,加速产品验证。

使用前请确保已安装Node.js环境(>=18.17.0)。建议将其作为Claude Code的Skill安装,以获得最佳的自然语言交互体验。如果已有SVG格式的Logo,也可以直接使用该工具进行格式转换。

核心特点

与仅提供图标搜索或简单尺寸调整的工具不同,本Skill深度集成Chrome扩展开发流程,实现了从海量图标库搜索、多尺寸PNG生成到manifest.json配置更新的全链路自动化,真正实现“一句话需求,全套图标就位”。

注意事项

不适合需要高度定制化、复杂图形设计或非Chrome浏览器扩展的图标生成场景。

常见问题

支持哪些图标库?

支持Iconify平台上的275,000+免费图标,包括Material Design Icons、Font Awesome、Heroicons等200多个图标集。

生成的图标尺寸符合Chrome商店要求吗?

是的,会自动生成16x16, 32x32, 48x48, 128x128四种Chrome扩展必需尺寸的PNG文件。

给 AI 助手的安装指引

如果你的 AI 编程助手(Claude Code、Cursor、TRAE 等)能看到这个页面,把下面这段发给它即可自动完成安装:

请访问 https://321skill.com/skills/chromeextensioniconsskill/raw/index.md 读取 ChromeExtensionIconsSkill 的原始 Skill 定义(Markdown 格式),按其中说明在我的环境里完成安装和配置。