# 在线检查和预览工具 > 适合谁看：拿到一个字体文件，想快速看看它有哪些字、哪些排版功能、可变轴怎么用，又不想装软件的人。 ## 常用的网页工具 | 工具 | 官网说明 | 适合做什么 | |---|---|---| | Wakamai Fondue | 回答「我的字体能做什么？」 | 看字体支持的 OpenType 功能、可变轴、字符集，并生成对应的 CSS 代码 | | FontDrop! | 拖入字体即可查看 | 浏览全部字形、查看字体信息和度量数据 | | Dinamo Font Gauntlet | 用于校样、生成和制作字体动画 | 测试可变字体在不同轴数值下的效果 | 用法都差不多：打开网页，把字体文件拖进去。 ## 使用时注意 - **商业字体要小心**：把字体拖进网页之前，看看工具是否说明字体只在本机浏览器处理、不会上传。不确定时，用本地工具更稳妥，比如 fontTools，见[《fontTools 入门：查看、修改、转格式》](https://docs.cocobook.com/link/1303)。 - **中文字体文件大**：几 MB 到几十 MB 的中文字体，网页工具加载和渲染全部字形会比较慢，耐心等待或只看需要的部分。 - **工具结果仅供参考**：最终效果要放到实际排版环境里测试。 ## 浏览器自带的开发者工具网页上的字体出问题时，先用浏览器的开发者工具看「实际用了哪款字体」： - **Firefox**：检查器里有「字体」面板，可以看到元素实际使用的字体，还能调整可变字体的轴数值； - **Chrome**（Edge 与之类似）：在「元素」面板的「计算样式」（Computed）底部有「Rendered Fonts」，列出这个元素实际用到的字体和字形数量。常见的网页字体问题和排查顺序见[《字体没生效？一套排查顺序》](https://docs.cocobook.com/link/1257)。 ## 系统自带的预览 - **macOS**：双击字体文件会用「字体册」打开预览； - **Windows**：双击字体文件会打开预览窗口，可以看到字体名称和样例文字。整理大量字体的工具见[《字体管理器：安装、预览和整理字体》](https://docs.cocobook.com/link/1301)。

参考资料