Chrome网页字体识别插件：悬停看出字体字号颜色，一键复制字体名，免费无广告
关键词：Chrome字体识别、网页字体查看、识别字体、WhatFont、字体检测、网页设计工具、奥米豆、免费Chrome扩展
浏览一个设计极美的网站，想知道标题用的是什么字体、正文多少像素、那个灰色到底是#999还是#666——打开开发者工具一层层翻DOM和计算样式，五分钟才能看个大概。奥米豆团队推出的Chrome网页字体识别插件，把这个过程压缩到一次悬停：开启识别模式，鼠标悬停任意文字，浮出卡片直接显示字体族、字号、字重、行高、颜色、字距，点击即复制字体名。设计师找参考、前端核稿、PPTer收集字体，都是秒级完成。全程免费、无广告、纯本地读取，不经过任何服务器。
一、这款插件是干什么用的？
网页上每个文字元素都有一组渲染参数：font-family字体栈、font-size字号、font-weight字重、line-height行高、color颜色、letter-spacing字距。这款插件进入识别模式后，实时追踪鼠标位置，读取指针下文字元素的最终计算样式，以信息卡片展示，并用虚线框高亮当前指向的元素——你看到的"这个标题是什么字体"，不再是猜，是精确答案。
典型使用场景：
- 设计找参考：采集优秀网站的字体搭配方案
- 前端核稿：对照设计稿核对线上实际字号字重
- 品牌分析：记录竞品页面的字体规范
- 学习积累：看到好看的字随手复制字体名回去装
二、核心功能介绍
1. 一键开启识别模式
点击扩展图标，点"开启字体识别"，鼠标指针变为问号，进入识别状态；再点一次或按Esc退出。识别期间不影响页面滚动和其他操作。
2. 悬停即看六要素
浮出卡片完整展示：字体族（font-family计算值）、字号、字重、行高、文字颜色（带色块预览）、字间距，外加当前元素的前24字样文，所见即所得。
3. 元素高亮定位
悬停时目标文字被蓝色虚线框精确定位，复杂嵌套页面里也能确认"看的到底是哪一层"，不会张冠李戴。
4. 点击复制字体族
识别模式下点击文字，字体族一键复制到剪贴板，并有"已复制"反馈。复制的是完整字体栈，粘进CSS直接可用。
5. 智能过滤
自动跳过脚本、样式、SVG内部、iframe、canvas等非文字区域，只对真实可见的文字元素出卡，鼠标划过图标、按钮不会被无效信息刷屏。
6. 纯本地读取，隐私安全
所有样式信息通过浏览器原生的getComputedStyle在本地读取，插件没有任何网络请求，不采集你浏览了哪些页面。装完即用，无需注册。
三、安装方法（3分钟搞定）
第一步：下载插件。下载插件压缩包并解压，得到"Chrome字体识别"文件夹，保持完整不要拆散。
第二步：打开Chrome扩展管理页。在Chrome地址栏输入chrome://extensions/并回车。
第三步：开启开发者模式。打开页面右上角的"开发者模式"开关。
第四步：加载扩展。点击左上角"加载已解压的扩展程序"，选中解压得到的文件夹。
第五步：固定到工具栏。点击Chrome右上角的拼图图标，找到"网页字体识别（奥米豆）"，点击图钉图标固定。
系统要求：Chrome 116或更新版本。
四、怎么使用（三步完成）
1. 打开目标网页，点扩展图标，点"开启字体识别"。
2. 鼠标悬停任意文字，查看浮出卡片的字体信息。
3. 点击文字复制字体族，Esc 退出。
五、注意事项
- 显示的是字体栈：卡片显示的是元素font-family的完整计算值（字体栈），页面实际渲染的是栈中你系统里第一个可用的字体；装齐字体后渲染效果才一致。
- 图标字体：网页图标（iconfont）本质是文字，悬停会显示其字体族（如iconfont、FontAwesome），属正常现象。
- 嵌套样式：悬停读取的是指针下文字最近祖先元素的样式，逐字悬停可对比正文与强调文字的差异。
- 受限页面：chrome://开头的浏览器内置页、扩展管理页、Chrome应用商店等无法使用。
六、常见问题（FAQ）
Q1：显示的字体族有四五种，到底哪个是实际字体？
font-family是"字体栈"，浏览器按从左到右的顺序使用第一个可用字体。想确认实际渲染字体，可把字体族逐个在系统字体册里排查，或配合截图比对。
Q2：为什么我悬停没反应？
确认已开启识别模式（按钮显示"关闭字体识别"）；确认鼠标指在文字上而非图片或空白区域；该页面若为浏览器内置页则不支持。
Q3：复制的字体族能直接用吗？
可以直接粘贴到CSS的font-family属性里；若只需其中一款字体名，手动截取即可。
Q4：会记录我浏览了哪些网站吗？
不会。识别是本地实时计算，插件零网络请求，无任何数据上报。
Q5：插件收费吗？
完全免费，无广告、无内购、无需注册。
七、结语
好设计藏在细节里，字体是细节中的细节。这款Chrome网页字体识别插件，让每一款让你心动的字体都无处遁形——悬停、看清、复制、带走。设计师的灵感库，前端的核对尺，都值得拥有。
立即下载体验，更多实用在线工具请访问奥米豆官网 https://www.aomidou.com/ 及奥米工具箱 https://www.aomidou.com/tools/，持续更新各类效率神器！