← Back
tjsky

tjsky/pinyin-annotator

一键给中文文章加上汉语拼音,生成适合幼儿园至小学低年级儿童的注音读物。

View on GitHub ↗https://pinyin-annotator.vercel.app ↗
Stars
347
Forks
67
Watchers
347
Open issues
1
Contributors
1
Language
HTML
License
MIT License
Default branch
main
Created Sep 17, 2026Updated Oct 1, 2026

Star growth

Today—
This week—
This month—

Star history will appear here once this repo has been tracked for a couple of days.

README

汉语拼音注音小助手 (Pinyin Annotator)

一键给中文文章加上汉语拼音(pīn yīn)或注音(ㄅㄆㄇ),生成适合幼儿园至小学低年级儿童与海外汉语学习用户的注音读物。 纯前端 · 单文件 · 离线可用 · 文章内容永不上传

开源仓库:https://github.com/tjsky/pinyin-annotator · 作者博客:秋风于渭水

License: MIT Engine

在线使用:拼音注音小助手(Github Page) |拼音注音小助手(Cloudflare Page)


为什么做这个

给低年级孩子生成带汉语拼音注音的读物时,网上工具要么弹广告、要么把文章上传到服务器、要么多音字错得离谱还不能改。这个小工具就是解决这些痛点的:

  • 内容不出本地:所有注音转换都在浏览器里完成,处理校内稿件、孩子姓名都没有隐私顾虑;
  • 准确率第一梯队:基于 pinyin-pro(官方基准准确率 99.846%),词组级多音字消歧(银行 / 行走 / 睡着了);
  • 错了能改:点任意生字手动改读音,轻声(子 zi、地 de、着 zhe)、儿化音都能强制指定。

工具界面预览

  • 版本选择界面

版本选择界面

  • 生成拼音

  • 生成注音

功能特性

注音引擎

  • 教材式上下注音排版,轻声自动不标调(妈妈 mā ma)。
  • 「一 / 不」变调开关:标实际读音(一个 yí gè)或标原调(yī gè),对齐教材习惯。
  • 儿化音双模式:逐字注音(花儿 huā er,适合指读认字)/ 标准拼音(花儿 huār,符合汉语拼音方案),女儿、儿童等真音节词自动豁免。
  • 单字手动改读音:点击生字弹出候选(含轻声/助词读音),改过的字标橙色。
  • 中文分词(主线版 / 完整词典版):内置约 3 万现代汉语常用词词典,可选「智能分词」(词组的字连在一起注音、词间留空隙,更贴近教材词组排版;多字词读音按词典标注更准,如 长长 cháng cháng、银行 yín háng)、「逆向匹配」与「逐字注音」(默认);点击任意生字可在弹窗中手动断词 / 合词,修正机器分词错误。
  • 重置样式:样式改乱了一键恢复默认
  • 单字儿化修正:人名「润儿」误判成儿化?点「儿」字一键强制儿化 / 非儿化
  • 易错点高亮:底纹标出多音字、儿化音、的地得、一 / 不变调、常见轻声字,快速扫视检查
  • 内置常用轻声词典:豆子、椅子、高兴地、慢慢地等直接标对
  • 拼音引擎内嵌离线可用,同时支持联网同步上游更新(jsDelivr / npmmirror 双源)

排版与输出

  • 汉字 16–48px 字号、楷体 / 宋体 / 黑体、霞鹜文楷 GB / 霞鹜文楷 TC / 芫荽 Iansui(网络字体,按需加载自动缓存),拼音字体独立设置,也可使用你电脑内的本地字体。
  • 简⇄繁转换引擎:OpenCC 驱动,「更多设置 → 繁简转换」可选 简体 ⇆ 标准繁体 / 台湾繁体 / 香港繁体;勾选「同时转换常用词汇」后连地区用词一并转换(鼠标→滑鼠、软件→軟體、打印→列印),一字多繁(头发→頭髮、发财→發財)始终自动区分。
  • 内嵌拼音 / 注音专用字体:楷体、宋体等常见中文字体里的拼音是普通拉丁字母写法(双层 a),不是教材拼音。工具内嵌 Andika 拼音字体(默认,显示教材单层 ɑ / 单层 g)与 ㄅㄆㄇ 注音字体 BpmfSubset(注音模式自动选用,也可在「音标字体」手动指定),无需额外安装任何字体;均以 SIL OFL 1.1 协议开源,可免费商用。
  • 可选「印氪先生拼音字体」:更接近教材上的拼音效果的拼音字体,在检测到本机已安装时会自动切换;未安装而手动选择时会提示下载并给出安装步骤(下载 → 解压 → 双击 ttf → 点「安装」→ 重启浏览器后点「重新检测」)。安装后即可默认调用,该字体仅限非商业场景使用,项目代码不包含字体文件,详见下方「字体版权说明」。
  • 可选多款简繁网络字体:支持多款网络字体,提供更好的简体/繁体显示效果
  • 可选列出本机全部字体:默认只显示常用字体,避免下拉列表过长;勾选「列出本机全部已安装字体」后,浏览器请求「字体访问」权限(需较新版本的 Chrome / Edge),本机字体族按名称去重排序,以「本地已安装字体」分组追加到汉字字体与拼音字体两个下拉框,取消勾选即恢复。
  • A4 纸样式预览:按 A4 纸宽高自动分页(每页容纳字数随字号、间距自动变化),所见即所印;手机等窄屏自动改为适应屏幕宽度的连续排版。
  • 长文模式(整本书支持):粘贴或导入超过 3 万字时自动进入(上限 200 万字),全文切成约 3 万字的块逐块排版,边处理边可翻阅(进度条实时显示);预览只渲染当前页,跳页按需排版,不卡界面。输入框转为只读摘要,点「退出长文模式」恢复编辑。
  • 字间距 / 行间距 / 段间距滑杆实时调节,解决长拼音黏连。
  • 翻页 / 连续滚动两种预览方式:翻页按 A4 逐页显示(翻页按钮或键盘 ←→),连续滚动一屏到底。
  • 打印 / 导出 PDF:A4 教材排版输出全部页面,页脚水印可勾选去除。长文模式下改为弹出打印对话框:可按页码范围打印,或分批打印全书(每批 100 页,上一批保存后自动弹出下一批),再用对话框里的「合并 PDF 文件」把各批按文件名顺序合成一个 PDF(pdf-lib 纯前端合并,全程本地不上传;合并组件首次使用需联网加载)。
  • 五种复制格式:富文本(粘贴进 Word 保留注音排版)、HTML ruby 标签、HTML+CSS 注音(网页源码,引用随站点部署的 zhuyin.css,横排 / 直排都与预览一致,可选配 font.emtech.cc 网络字体如芫荽 Iansui / 霞鹜文楷 TC)、字「音标」逐字对照、只复制音标(保留原文标点与分段,适合出练习题);音标随当前模式——拼音模式复制拼音,注音模式复制注音(ㄅㄆㄇ)。Word 对注音声调定位支持有限(富文本精确标注需逐一适配多种注音字型,超出几 MB 在线工具的能力),富文本中注音为横排、声调符号缀在符号末尾
  • 注音芫荽 IVS 模式:「HTML+CSS 注音」直排 + 网页字体选「注音芫荽 BpmfIansui」时,每个字的正确读音以 IVS 异体字选择符(U+E01E0+序号,规格见 ButTaiwan/bpmfvs)写入文字,由字型自行标注右侧注音;多音字读音随本工具的台湾读音数据选取,读音表(18,626 字,构建期从 bpmfvs 读音表 phonic_table_Z.txt 生成,仅注入注音版)未收的字自动切回常规字形并用结构标注,不会显示字型默认的错误读音。横排时该字体仅用于注音符号(其汉字字形自带注音,整段套用会重复标注);装有注音芫荽字型的 Word 等软件可直接使用带 IVS 的文字
  • **阅读模式:**隐藏编辑区,设备直接递给小朋友,方向键翻页。

导入

  • TXT 文件导入,自动识别 UTF-8 / GBK 编码

快速开始

  • 在线使用:拼音注音小助手(海外用户推荐访问) |拼音注音小助手(国内用户推荐访问)

    首次访问会展示四个版本的对比卡片,选一个进入即可;选过之后浏览器会记住,下次自动进入上次用的版本(也可在页面换版本);

  • 本地使用:

    1. 下载仓库(Code → Download ZIP,或 git clone);
    2. 解压后双击 index.html(版本选择页)——完成,不需要安装任何东西;首次访问会展示四个版本的对比卡片,选一个进入即可,浏览器会记住选择、下次自动进入(也可在页面换版本;本地打开旧入口 main.html 会提示改用 pinyin.html);
    3. 粘贴文章 → 调整字号间距 → 打印 / 导出 PDF,或复制进 Word。
版本 文件 体积 分词
版本选择页 index.html 约 20 KB SEO 落地(简/繁/EN 三语)/ 四版本对比 / 记忆跳转 / Plus 下载进度条
主线版(推荐) pinyin.html 约 1.4 MB ✅ 智能分词 / 逆向匹配 / 逐字注音,可手动断词合词(在线演示默认版本)
完整词典版 plus.html 约 7 MB ✅ 同上,词典扩充到 33.7 万词,成语 / 长尾词分词更准;内建 OpenCC 简 ↔ 繁转换
注音版 zhuyin.html 约 2.3 MB ✅ 预设繁體介面 + 注音符號(ㄅㄆㄇ,橫排 / 直排)+ 臺灣讀音 + OpenCC 簡↔繁轉換 + 注音 IVS 讀音表,面向港澳台用户
轻量版 mini.html 约 0.9 MB ❌ 固定逐字注音(不内置词典,适合只需要注音排版的场景)

全部版本均支持 简体 / 繁體 / English 界面、拼音 / 注音(ㄅㄆㄇ)双模式,以及 「一 / 不」变调开关。拼音模式提供「拼音位置」切换(上方默认 / 右侧旁落);注音模式提供「注音方向」切换:横排(符号横写标在字上方,调号标在末符上方)与直排(台湾直式教科书风格,符号自上而下竖排、标注在汉字右侧,调号标在末符右方);切换后 A4 预览自动重新分页,打印 / 导出 PDF 所见即所印。 「更多设置 → 读音标准」可切换 普通话读音 / 台湾读音(拼音与注音模式都生效):普通话读音以《现代汉语词典》为准(数据来源 zh-lx/pinyin-pro);台湾读音以《重編國語辭典修訂本》为准(数据来源 g0v 萌典),覆盖约 1.5 万词、200 字(简繁字形均可命中,如垃圾 ㄌㄜˋㄙㄜˋ、期待 ㄑ丨ˊ、攜帶 ㄒ丨、血液 ㄒ丨ㄝˇ、混淆 ㄏㄨㄣˋ丨ㄠˊ),词典文本授权为 CC BY-ND 3.0 臺灣(许可协议要求保留的原始署名:教育部)。 zhuyin.html 与 plus.html 内嵌 OpenCC(nk2028/opencc-js)(Apache-2.0),输入区提供「转为简体 / 转为繁体」一键转换;「更多设置 → 繁简转换」可选 简体 ⇆ 标准繁体 / 台湾繁体 / 香港繁体,配合「同时转换常用词汇」勾选(台湾 / 香港繁体时可用)连地区用词一并转换;zhuyin.html 首次打开即为繁体界面、注音符号与台湾读音(可随时切换)。

推荐使用 Chrome / Edge 等现代浏览器。全部功能在本地运行、文章永不上传;联网仅用于可选的拼音引擎更新检查与网络字体加载(不选网络字体即完全离线)。

部署到静态托管(GitHub Pages / Cloudflare Pages / Vercel)时,把 index.html 与四个版本文件一起放到根目录即可,入口即版本选择页;帖子里分享指定版本可用 https://你的域名/?v=plus 这样的参数直接访问对应版本(?v=pinyin / ?v=zhuyin / ?v=mini 同理,旧链接 ?v=main 自动兼容跳转主线版)。

部署在线版(GitHub Pages)

  1. Fork 或新建仓库(建议命名 pinyin-annotator,Public 可见);
  2. 把 index.html、mini.html、pinyin.html、plus.html、zhuyin.html 与 zhuyin.css(「HTML+CSS 注音」复制格式引用的样式表,缺了粘贴目标网页拉不到样式)一起放到仓库根目录(网页上传或 git push 均可);main.html 为旧入口跳转页(手工维护,不参与构建):在线打开自动跳 pinyin.html,本地打开提示下载新入口,建议一并上传;
  3. 打开仓库 Settings → Pages → Build and deployment:
    • Source 选 Deploy from a branch
    • Branch 选 main,目录选 / (root),点 Save;
  4. 等 1–2 分钟,访问 https://<你的用户名>.github.io/pinyin-annotator/ 即可;
  5. 以后更新:重新上传有改动的 HTML / CSS 文件覆盖即可,无需其他配置。

也可以放到任何静态空间(VPS、对象存储、Cloudflare Pages),单文件零后端。

隐私与安全说明

  • 所有注音转换在浏览器本地完成,文章内容不上传到任何服务器;
  • 「检查拼音引擎更新」仅向 jsDelivr / npmmirror 请求引擎版本号与代码,不涉及文章内容;
  • 网络字体(霞鹜文楷 GB / TC、芫荽等)仅在主动选择时从 CDN 加载字体文件,不涉及文章内容;
  • 工具默认不收集任何个人信息,无统计、无广告。

准确性说明

拼音引擎准确率约 99.8%,但不承诺 100% 正确——多音字、轻声、儿化音在特定语境(尤其是人名、专名)下仍可能误判。各版本内嵌词典不同、多音字处理能力也不同(完整词典版最高,预览框底部有相应提示)。工具因此提供:

  • 易错点高亮,方便快速检查(教学场景建议开启后逐字过一遍);
  • 单字手动改读音、单字儿化修正。

正式使用前,建议开启「易错点高亮」快速过一遍。

技术栈

  • 纯原生 HTML / CSS / JavaScript;源码为 template.html 模板 + build.js 构建脚本,产出四个单文件成品(成品零依赖,可直接双击打开)
  • 拼音引擎:pinyin-pro(内嵌 + 可在线更新)
  • 分词词典:取自 @pinyin-pro/data modern(gzip 内嵌,启动时解压注册)
  • 繁简转换引擎:nk2028/opencc-js(gzip+base64 内嵌,懒解压)
  • 台湾读音差异表:g0v/萌典(构建期生成,内嵌)
  • 注音 IVS 读音表:ButTaiwan/bpmfvs(构建期生成,仅注入注音版内嵌)
  • 感谢 zh-lx、nk2028、g0v 萌典、ButTaiwan 等开源项目与作者。

字体版权说明

「Andika拼音字体(免费商用)」(Andika Regular 子集):

  • 本工具内嵌了 Andika Regular 的拼音字形子集(仅拼音与拼音声调字母)。
  • Andika 由 SIL International 发布,以 SIL Open Font License 1.1 授权:可免费用于个人与商业场景、可内嵌分发;保留版权与许可声明。本子集未修改字形设计。
  • 注意:部分地区版权机构不认可 OFL 1.1 协议的效力,会要求提供传统「授权证明」,若出现这种情况,建议您放弃使用本字体,改用可开具授权证明的免费商用字体或购买商业版权字体。

「霞鹜文楷 GB(简体·网络字体)」:

  • 「霞鹜文楷 GB(简体·网络字体)」按需从 jsDelivr CDN 加载 lxgw-wenkai-gb-web 的字体分包,本工具代码中不包含该字体文件。
  • 霞鹜文楷 GB 以 SIL Open Font License 1.1 授权,可免费商用;版权归属 LXGW / Klee Project 等原作者,详见其仓库声明。
  • 注意:部分地区版权机构不认可 OFL 1.1 协议的效力,会要求提供传统「授权证明」,若出现这种情况,建议您放弃使用本字体,改用可开具授权证明的免费商用字体或购买商业版权字体。

「霞鹜文楷 TC / 芫荽 Iansui / 注音芫荽 BpmfIansui」(繁体网络字体):

  • 三者均按需从免费字体服务 font.emtech.cc 加载字体分包,本工具代码中不包含字体文件;「注音芫荽 BpmfIansui」仅用于「HTML+CSS 注音」复制格式的 IVS 模式。
  • 芫荽 Iansui 与注音芫荽由 ButTaiwan(iansui / bpmfvs)发布,霞鹜文楷 TC 版权归属原作者 lxgw,均以 SIL Open Font License 1.1 授权,可免费商用。
  • 注意:部分地区版权机构不认可 OFL 1.1 协议的效力,会要求提供传统「授权证明」,若出现这种情况,建议您放弃使用本字体,改用可开具授权证明的免费商用字体或购买商业版权字体。

「印氪先生拼音字体(更接近教材)」(印氪先生汉语拼音 优化版W4):

本项目涉及使用了「印氪先生汉语拼音 优化版W4」商用拼音字体。

  • 项目代码中不包含字体文件:工具只在您本机已安装该字体时调用它;未安装时会提示您自行前往下载地址安装,不安装也不影响任何功能(拼音可用内嵌的 Andika 拼音字体)。
  • 该字体版权归字体作者印氪先生所有,仅限非商业场景下使用;如需商用或内嵌,请自行联系印氪先生购买授权:印氪先生(知乎主页)。
  • 免责声明:本项目 README 及仓库中的演示截图展示该字体的效果,仅为说明工具的拼音显示能力,截图中的字体为「印氪先生汉语拼音 优化版W4」商用字体,本开源项目不提供该字体文件;如需商用请自行联系购买授权。
  • 提醒:您电脑 / 手机里的黑体、宋体、雅黑等同样是有版权的字体。网页调用本地已安装字体是允许的,但把他们打印为成品分发使用时,请留意所用字体的授权范围。

开发计划&待修复问题

TODO

  • 拆分版本:mini / pinyin(原 main)/ plus / zhuyin 四版 + 入口页

  • 简体/繁体/英文界面切换(i18n 内核 + 三语包)

  • 拼音/注音双模式(音节级映射转换;注音支持横排 / 直排,拼音支持上方 / 右侧)

  • 台湾读音差异表(萌典数据构建期 diff,拼音与注音模式均生效)

  • 简繁转换(OpenCC,注音版 / 完整词典版内置;支持标准 / 台湾 / 香港繁体与常用词汇转换)

  • 五种复制格式(含 HTML+CSS 注音、注音芫荽 IVS 模式)

  • 网络字体(霞鹜文楷 GB / TC、芫荽 Iansui,按需加载自动缓存)

  • 长文模式:超过 3 万字自动分块排版(上限 200 万字),支持整本书籍;打印支持页码范围 / 分批全书 + PDF 合并

  • 更多的注音与拼音方案:如華語羅馬拼音 (THL)、通用拼音、注音二式、威妥瑪拼音。

  • 粤语拼音(粤拼)支持:粤音标音标准较混乱,不保证效果,目前暂未找到权威标准文件(如政府标准、学校教材)与可用开源库,欢迎提供参考资料。

已知问题

  • 分词字典导致错误读音:有时候先分词再标读音反而会导致错误的读音。说人话就是:个别字的读音,可能mini版比plus版更准(但绝大部分时候plus版对多音字的判断更准),涉及拼音引擎本身能力的问题。

  • 预览与打印BUG:文章本身如果没有换行,只有超级长的一行时,翻页模式下,PDF和预览从第二页开始,排版会出错。

  • 繁简转换时常用词汇未正确转换:如鼠标→滑鼠、软件→軟體、打印→列印

Star History

Star History Chart

License

MIT