开发者工具集
返回 工具

图标生成器

生成可上线的 favicon、PWA 图标、App 图标和前端集成代码

我的工具
暂无工具

加载中...

如何生成前端图标

  1. 1

    选择模板

    先从图形模板开始，也可以切换为上传图片、文字或 emoji。

  2. 2

    选择发布目标

    先确定网站 / PWA、App 图标或小程序 TabBar，需要时再勾选附加输出。

  3. 3

    生成资产

    只生成当前目标需要的图片、配置和代码，预览与导出保持同一版本。

  4. 4

    复制代码

    把 HTML、Next.js、Vite、Nuxt、uni-app、Taro 或微信小程序片段复制到项目里。

功能概览

为前端项目设计并生成可上线的产品图标。先选择网站 / PWA、App 图标或小程序 TabBar 交付目标，再从内置模板、文字、emoji 或上传 Logo 开始设计；工具只生成当前目标需要的文件，也可以按需附加其他平台。

工具描述

面向前端工程师的免费图标生成器。上传 Logo、SVG、图片、文字或 emoji，即可生成 favicon、Apple Touch 图标、PWA manifest 图标、小程序 tabBar 图标，并复制 HTML、Next.js、Vite、uni-app、Taro、微信小程序配置片段。所有处理都在浏览器本地完成。

能力清单

  • 从 18 个图形模板和推荐设计开始，而不是从空白参数或上传文件开始。
  • 按发布目标生成 favicon、Apple Touch、Android/PWA 或小程序 TabBar 文件，避免混入无关资产。
  • 复制 HTML、Next.js、Vite/React、Nuxt、SvelteKit、Astro、uni-app、Taro、微信小程序配置片段。
  • 预览浏览器标签、搜索结果、移动端桌面、PWA 安装卡片和小程序 tabBar 状态。
  • 校验低对比、小主体、重光效、透明 App 图标、SVG 风险和小程序 tabBar 文件体积。
  • 所有图片处理都在浏览器本地完成，不上传 Logo 或 App 图标。

相关工具

二维码生成识别工具

生成自定义二维码，识别图片中的二维码

Base64 编码解码器

支持文本和文件的 Base64 编码解码，可预览图片

无限画布

浏览器端白板，支持模板、文本生成图、连接线、导出和本地保存

常见问题

图标生成器会上传我的 Logo 吗？
不会。第一版在浏览器本地处理上传文件，并在本地生成 ZIP。
可以生成微信小程序 tabBar 图标吗？
可以。工具会生成普通态和选中态 81x81 tabBar 图标，并提供 app.json、uni-app、Taro 配置片段。
第一版会接 AI 吗？
不会。第一版专注确定性的前端图标生成和导出，AI 图标生成可以后续再加。