如何用在线工具制作 favicon.ico 并添加到网站?
用 favicon.cc 这类在线生成器，你可以直接在浏览器里画一个 16×16 像素的图标，或导入现成图片，导出 favicon.ico 后放进网站目录，再在 HTML 的 <head> 里用 <link> 引用，浏览器标签页就会显示它。适合没有设计工具、只想快速做一个站点图标的人；如果你需要多尺寸自适应图标（如 SVG 或 180×180 的 Apple Touch Icon），这个流程只覆盖最基础的 .ico 部分。
在 favicon.cc 上制作图标
打开 favicon.cc 后，页面提供两条起点：
- Create New Favicon：从空白像素画布开始，逐格点画。
- Import Image：导入已有图片，再在画布上微调。
绘制时的核心操作：
- 在 Color Picker（取色器）里选颜色，输入框显示的是十六进制色值（页面示例为
0084FF），也可以调 Transparency（透明度）。 - 用鼠标在像素方格上点击上色，画出你的 logo 或字母。
- Last Used Colors 会保留最近用过的颜色，方便重复取色。
- 需要移动已画内容时用 move 工具。
页面自带的说明就是这套流程：选颜色 → 点击方格绘制 → 完成后下载 → 把 favicon.ico 放进网站目录 → 可选地以 CC（Creative Commons）许可发布。
动画帧设置（可选）
favicon.cc 支持把图标做成动画。相关控件包括：
- Frame 区域：Append New Frame（追加新帧）、Copy Previous Frame（复制上一帧）、Delete Frame（删除帧）、Clear Frame（清空当前帧）。
- 每帧可单独设置停留时间，从 0.05 秒到 20 秒不等。
- 播放控制：animate preview、loop forever（无限循环）、stop at last frame（停在最后一帧），以及 2–20 次之间的循环次数。
- 顶部有 Don't Use Animation / Use Animation 开关，不需要动画时直接关掉。
如果你只是要一个静态站点图标，保持不启用动画即可，文件更小、兼容性也更简单。
预览与下载
画完后页面提供 Preview Favicon in original size，也就是按原始尺寸（16×16）预览，这一步很关键——很多图标在大图上好看，缩到 16 像素就糊成一团。确认效果后点 Download Favicon 下载 favicon.ico。
favicon.cc 还提供 Publish under an open license 选项，可以把图标以 Creative Commons 许可公开，同时站点有 Latest Favicons、Top Rated Favicons 等浏览入口，以及按 flower、letter、logo、animated 等标签分类的 Tag Cloud。
把 favicon.ico 添加到网站
拿到文件后：
- 把
favicon.ico上传到网站的根目录（即https://你的域名/favicon.ico能直接访问的位置）。多数浏览器会自动请求这个路径。 - 为了更明确地指定，在 HTML 的
<head>里加一行：
<link rel="icon" href="/favicon.ico" type="image/x-icon">
- 保存后刷新页面。浏览器对 favicon 缓存较顽固，如果没立刻变化，可以强制刷新（Ctrl/Cmd + Shift + R）或换个无痕窗口验证。
常见卡点
- 图标不显示：先直接在地址栏访问
/favicon.ico，确认文件确实可访问、路径没写错、文件名大小写一致。 - 显示的是旧图标：多半是浏览器缓存，清缓存或用无痕窗口再看。
- 图标模糊：回到生成器用原始尺寸预览检查，16×16 下细节过多必然糊，简化图形通常比加细节有效。
- 需要多平台图标：
.ico只解决浏览器标签页；iOS 主屏图标、PWA 图标等需要额外的 PNG/SVG 文件，不在这个工具的输出范围内。
favicon.cc 由 Xoron GmbH 运营，站点底部标注版权年份为 2026。工具本身可在线使用，但页面未说明账号、价格或下载限制，涉及登录（Login / Register）的功能请以实际页面为准。