背景

做过移动开发的朋友应该都遇到过这个痛点:一个 1024x1024 的 App 图标,需要手动导出 iOS 的 20 多种尺寸、Android 的自适应图标( Adaptive Icon )、还有 Web 的 Favicon 等等。用 PS 或 Sketch 手动切图不仅繁琐,而且容易出错。

更头疼的是,很多独立开发者或小团队连 Logo 都还没有,就要开始做 App Icon 了。

解决方案

我做了 AppIconGenerator 来解决这两个痛点:

1. 一键生成多平台图标

核心功能:

  • 上传一张 1024x1024 的图片,自动生成 iOS 、Android 、Web 、Chrome 等平台所需的全部尺寸
  • 直接生成标准文件夹结构(如 iOS 的 AppIcon.appiconsetContents.json),拖进 Xcode 就能用
  • 支持 Android Adaptive Icon ,自动处理前景层和背景层

隐私优先:

  • 100% 浏览器本地处理,图片不会上传到任何服务器
  • 用 Canvas 和 WebAssembly 在本地完成所有转换
  • 特别适合处理客户的敏感资料

2. AI Logo 生成器

如果你还没有 Logo ,可以用内置的 AI Logo Maker:

  • 提供 1000+ 专业图标符号库
  • 支持自定义颜色、边框、渐变、阴影等
  • 一键导出高清 PNG 和矢量 SVG
  • 完全免费,无水印

实际使用场景

  1. 独立开发者:快速为自己的 Side Project 生成各平台图标
  2. Flutter/RN 开发者:一次生成 iOS + Android 全套资源
  3. 设计师:给客户交付时直接提供标准格式,不用担心遗漏尺寸
  4. Chrome 插件开发:生成插件商店所需的各种尺寸

技术特点

  • 纯前端实现,无需后端服务器
  • 实时预览各平台效果(如 Android 圆角遮罩、iOS 圆角等)
  • 支持 PNG 、JPG 、WEBP 、SVG 格式
  • 响应式设计,移动端也能用

工具地址

主站: https://appicongenerator.org AI Logo 生成: https://appicongenerator.org/app-logo-maker

最后

这个工具完全免费,目的是帮开发者节省时间。如果你觉得有用,欢迎分享给需要的朋友。也欢迎提出改进建议!

举报· 515 次点击
登录 注册 站外分享
4 条回复  
BeCool 初学 前天 12:58
体验了下,请问 logo 生成时 AI 是体现在哪里
HuLeiY 楼主 初学 前天 13:06
@BeCool AI 生成 Logo 还在打磨,很快可以上线哈
darlinghsu 小成 前天 13:18
以前看张鑫旭博客,推过这个: https://realfavicongenerator.net/ 我个人觉得够用了(主要是生成其他平台图片)
tangping 小成 前天 14:01
.9 图搞一个
返回顶部