插件小屋
WhatFont – 网页与图片字体识别

WhatFont – 网页与图片字体识别

0.0.7
2026-11-04
0
4.8
WhatFont – 网页与图片字体识别 - 截图 1WhatFont – 网页与图片字体识别 - 截图 2WhatFont – 网页与图片字体识别 - 截图 3WhatFont – 网页与图片字体识别 - 截图 4WhatFont – 网页与图片字体识别 - 截图 5

插件介绍

这是什么字体?一键识别网页或图片中的字体:字体族、字号、字重、颜色,以及整页用到的全部字体。

这是什么字体?一键识别网页和图片中的任意字体
WhatFont 把任何网站都变成字体样张。把鼠标移到文字上,就能看到真正被渲染的字体;点击一下,完整的 CSS 参数一览无余;框选一个 Logo,还能识别图片里的字体。不用开发者工具,不用「检查元素」,不用猜。
🔍 识别任意网站的字体
• 鼠标悬停即可——提示显示真正渲染出来的字体,而不是 CSS 里的候选列表
• 点击查看全部参数:字体族、字号、行高、字重、字形、字间距
• 完整的字体栈,并高亮浏览器实际选中的那一款
• 方向键沿页面结构移动,再小的图注也能精准选中
🖼️ 识别图片和 Logo 中的字体
• 框选屏幕上的任意区域:Logo、横幅、截图、视频画面
• 一键发送到 Adobe Fonts 或 WhatTheFont 的图片搜索
• 也可以把截取的图片保存为 PNG 或复制到剪贴板
🗂️ 页面上用到的全部字体
• 一键列出整页使用的每一款字体
• 每款都标明:用在多少个元素上、有哪些字重、字号范围
• 复制字体名称,或直接跳转到页面上对应的文字
🎨 颜色、对比度与现成 CSS
• 文字颜色同时给出 HEX 和 RGB——点一下即可复制
• 相对真实背景的 WCAG 对比度,并给出 AA / AAA 结论
• 复制 CSS:整段字体声明,直接粘贴进样式表
• 字体来源:Google Fonts、Adobe Fonts、网站自建或系统字体,并附带链接
⚡ 使用方法
1. 点击 WhatFont 图标,或按 Alt+Shift+F
2. 把鼠标移到文字上查看字体
3. 点击文字查看完整参数,或按 Capture 识别图片中的字体
4. 按 Esc 关闭
写给设计师和开发者
收集排版参考、复刻设计系统、找到客户的品牌字体、检查文字颜色的无障碍表现,或者几秒钟回答「这个网站用的是什么字体」。
🔒 隐私
WhatFont 完全在浏览器内工作,不收集也不上传你的浏览数据。只有在你自己选择搜索服务之后,截取的图片才会被发送。
———————————
WhatFont — a free font finder and font identifier for Chrome. Hover over text to see what font a website uses, inspect the full CSS spec (family, size, weight, colour), check WCAG contrast, list every font on the page, and identify fonts from images, logos and screenshots with Adobe Fonts or WhatTheFont visual search.


插件详情

评分
4.8星(共5星),共17位用户参与评分
使用人数2000
版本0.0.7
文件大小94.96KB
支持语言47 种语言
IDcnchnbcmhjadlbdbcebikmkbdlaajnni
发布时间2026-11-04 16:29:49