网站图标（Favicon）虽然微小，但至关重要。在浏览器标签页中显示一个清晰、可识别的 32×32 像素图标，能彰显精致感。但大多数网站图标工具要么需要上传文件、注册邮箱，要么依赖臃肿的 JavaScript 框架。我想要的是那种打开即用、10 秒内完成操作并关闭——且没有任何数据发送到服务器的工具。
因此，我构建了网站图标生成器：这是一个单独的 HTML 文件，可将文本、表情符号或粘贴的 SVG 代码转换为 PNG 文件（尺寸从 16×16 到 180×180）以及多尺寸的 .ico 文件。所有处理均在浏览器中运行。零上传。零追踪。
在线工具 → devnestio.pages.dev/favicon-generator/
功能介绍
- 文本或表情符号输入 — 输入 1–3 个字符（如“Fg”、“JS”、“🚀”），画布应用程序接口（Canvas API）会实时渲染它们
-
SVG 粘贴 — 粘贴任意 SVG 代码；它通过
URL.createObjectURL进行渲染，并缩放以填充画布 - 背景与前景色选择器，配有十六进制文本输入框（支持三位简写格式）
-
自动对比度按钮 — 使用 Web 内容无障碍指南（WCAG）2.1 相对亮度标准，自动选择
#000000或#ffffff - 圆角半径滑块 — 从 0%（锐利方形）到 50%（完美圆形）
- 字体系列选择器 — 系统无衬线字体、衬线字体、等宽字体、Impact 字体
- 手动字号覆盖 — 或者保持“自动”模式，工具将根据字形数量进行缩放
- 10 种一键预设 — 包含编程语言徽标（JavaScript、Go、Python、TypeScript）和表情符号风格
- 实时预览 — 256 像素主画布、浏览器标签页模拟（含仿制浏览器界面）、手机主屏幕模拟
- 下载单个 PNG 文件 — 提供 16、32、64、128、180 像素的下载按钮
- 下载 ZIP 压缩包 — 将所有选定的尺寸打包，纯 JavaScript 实现（不使用 JSZip，无外部库）
-
下载 ICO 文件 — 将 16 像素和 32 像素图像打包成真正的
.ico二进制文件，根据 ICO 规范手工编写实现
技术亮点
从零构建 ICO 格式
ICO 是一种二进制容器格式。现代工具直接在其中嵌入 PNG 数据（而非原始位图 BMP），自 Internet Explorer 10 及以上版本起，浏览器均能识别这种格式。
其结构非常直观：
图标目录 (ICONDIR)（6 字节）
保留字段 [0x0000]
类型 [0x0001] ← 1 = 图标 (ICO), 2 = 光标 (CUR)
数量 [N]
图标目录条目 (ICONDIRENTRY) × N（每个 16 字节）
宽度 [1 字节] ← 0 表示 256
高度 [1 字节]
颜色数量 [0] ← 0 = 无调色板（用于 PNG）
保留字段 [0]
平面数 [0x0001]
位深 [0x0020] ← 32 位每像素 (bpp)
资源字节数 [uint32] ← PNG 数据块的大小
图像偏移量 [uint32] ← 距文件起始位置的字节偏移量
PNG 数据 × N
第一个图像的偏移量 = 6 + 16 * 数量。每个后续图像紧接在前一个图像之后。简单明了。
function createIco(images) {
// images = [{width, height, pngData: Uint8Array}]
const count = images.length;
const dirSize = 6 +免责声明：本文内容来自互联网，该文观点不代表本站观点。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，请到页面底部单击反馈，一经查实，本站将立刻删除。
