没有 favicon，你的新应用看起来就像没做完
你发布了功能、接好了数据库、部署到了一个真实的 URL，浏览器标签页却还显示着一张空白的纸。它只是一个小小的 16×16 方块，却在悄悄告诉每一位访客：这个产品还没做完。
为什么总会发生
favicon 是最后那 1%，没人会把它排进日程。搭建项目脚手架时会免费送你一个占位图标，于是警告永远不会触发，占位图就一路坐到了生产环境。
手动做一套像样的图标实在很烦：导出十几个尺寸、生成 ICO、手写 manifest、粘贴二十条 link 标签。于是它被推到了“以后”，而以后从来不会到来。
空白标签页为什么让你付出代价
标签页图标是你品牌最小的样子。当有人开着 30 个标签页时，favicon 是他们重新找到你的唯一方式。空白的图标等于隐形。
它也是最便宜的可信度信号。清晰的图标读起来像“一个真正的产品”，空白的图标读起来像“一个周末做的原型”，哪怕底层的代码非常出色。
所有人真正看到的那个方块
图标缺失的蛛丝马迹
如果下面任何一条在你的线上站点上成立，访客看到的就是一个没做完的应用：
浏览器标签页里待着一个空白的、卷角纸张状的图标。
框架默认图标（Next.js、Vite 或 Create React App 的 logo）被发到了生产环境。
有人为了让警告消失，往 public/favicon.ico 里塞了一张像素化、被拉伸的截图。
图标对不上：标签页里一个样，iOS 主屏幕上另一个样，PWA 安装提示里什么都没有。
一步解决
只要你不再把图标当成一件手动杂活，整个问题就会立刻消失。流程很短：
- 1
选择一个来源
一个 emoji、一个品牌标记、你的 logo 文件，或一张图片的 URL。
- 2
生成整套图标
favicon.ico、所有 PNG 尺寸、apple-touch-icon、Android 图标，以及 manifest.json。
- 3
安装它
把文件放进 public/，把 link 标签放进你的 <head>（或 app/layout.tsx）。
- 4
验证它
在你收工之前，确认它在标签页、移动端和安装提示里都能正常渲染。
手动做，还是让 agent 做
手动做
它被一拖再拖的原因
- 导出十几个尺寸。
- 生成一个 ICO。
- 手写一个 manifest。
- 粘贴二十条 link 标签。
让你的编码 agent 来做
Start hereClaude Code、Cursor，或任何支持 MCP 的 agent
- 你根本不用打开任何 favicon 生成器。
- 图标被直接创建并安装进仓库：文件写好，<head> 修补完成。
- 全都来自一句提示词，比如“给这个应用添加一个狐狸 favicon”。