LaTeX 公式转 PNG / SVG：几种实用方案和使用场景对比

最近在整理技术文档时碰到一个比较常见的问题：

手里已经有 LaTeX 公式，但目标平台并不支持 LaTeX，怎么把公式稳定地转换成图片？

比如下面这个公式：

\int_0^\infty e^{-x^2}\,dx = \frac{\sqrt{\pi}}{2}

如果是在 Markdown、Jupyter Notebook、Overleaf 里，直接渲染就行。

但实际工作中经常需要把公式放到：

• PowerPoint
• Word
• 技术方案文档
• README
• 博客后台
• 图片素材
• 不支持 MathJax 的 CMS
• 聊天或协作文档

这个时候，把 LaTeX 转成 PNG 或 SVG 往往是最直接的方案。

这篇文章把我目前比较常用的几种方法整理一下，也顺便说说 PNG、SVG、MathJax、KaTeX 分别适合什么场景。

---

1. 先明确一个问题：真的需要转成图片吗？

很多时候，我们第一反应是：

LaTeX → 图片

但其实并不是所有场景都需要这么做。

如果目标平台支持 MathJax 或 KaTeX，那么最好直接保留 LaTeX。

例如：

$$
E = mc^2
$$

这样做的优点很多：

• 放大不会模糊
• 可以复制公式
• 后期修改方便
• 页面适配更自然
• 对技术文档更友好

所以我一般会先判断目标环境。

目标平台支持 LaTeX
    ↓
直接渲染

目标平台不支持 LaTeX
    ↓
转 PNG / SVG

图片更多是一个兼容方案。

---

2. PNG 和 SVG 应该怎么选？

这是最常见的问题。

PNG

PNG 是位图。

简单理解就是，它由一个个像素组成。

优势：

• 兼容性好
• Word、PPT 基本都能直接使用
• 支持透明背景
• 上传到各种平台比较省心

缺点：

• 放大之后可能变模糊
• 分辨率需要提前考虑

适合：

Word
PowerPoint
聊天软件
普通文档
部分 CMS

---

SVG

SVG 是矢量图。

它保存的并不是固定像素，而是图形和路径信息。

最大的优势就是：

放大以后依然清晰。

适合：

网页
博客
技术文档
PPT
海报
需要后期缩放的场景

如果目标软件支持 SVG，我一般会优先 SVG。

---

3. 方法一：直接截图

最简单粗暴的方法当然还是截图。

例如在支持 LaTeX 的编辑器里先输入：

\frac{-b\pm\sqrt{b^2-4ac}}{2a}

等公式渲染出来以后直接截图。

优点

很明显：

快

不需要装环境，也不需要转换。

如果只是临时在聊天中发一个公式，截图完全够用。

---

缺点

问题主要有三个。

放大容易糊

假设截图宽度只有 300px，然后放到 PPT 里拉到 900px。

相当于直接放大三倍。

边缘自然会变虚。

---

背景不好处理

比如截图时是：

黑色公式
+
白色背景

放到深色 PPT 上就会出现一个明显的白色块。

---

尺寸不统一

如果一篇文档里有几十个公式，每个都手工截图，很难保证：

• 边距一致
• 大小一致
• 清晰度一致

所以截图比较适合一次性的临时需求。

---

4. 方法二：直接导出 PNG

如果需要比较正式地使用公式，PNG 是比较稳妥的选择。

比如：

\sum_{i=1}^{n} i = \frac{n(n+1)}{2}

直接渲染成 PNG。

这时候需要注意的其实不是“能不能导出”，而是：

导出的尺寸够不够。

如果最终图片需要显示得比较大，最好一开始就生成较大的 PNG。

例如：

500 × 120

通常会比：

200 × 48

更适合后续排版。

因为：

大图缩小通常没问题，小图放大很容易糊。

---

5. 做 PPT 时建议使用透明背景

如果目标是 PPT，这一点很重要。

例如深色背景的幻灯片。

如果公式是白底图片：

┌─────────────────────┐
│     E = mc²         │
└─────────────────────┘

视觉上会很突兀。

更好的方式是：

白色公式
+
透明背景

对于 PNG 来说，需要导出带 Alpha 通道的透明图片。

比如公式：

\sqrt{x^2+y^2}

在深色 PPT 里可以设置成：

文字颜色：白色
背景：透明

这样放进去以后基本不需要再处理。

---

6. 方法三：使用 SVG

如果要解决“公式放大后模糊”的问题，SVG 是最省心的方案。

例如：

x^2 + y^2 = r^2

如果导出 PNG，它可能只有固定的：

400 × 80 px

而 SVG 并没有固定像素尺寸。

因此同一个 SVG：

显示 200px 宽

或者：

显示 2000px 宽

一般都能保持清晰。

这对于下面这些场景特别合适：

• 高清 PPT
• 技术博客
• 大尺寸海报
• 文档导出 PDF
• Retina / 4K 屏幕

---

7. 方法四：在线转换

如果只是偶尔转换几个公式，我个人不太愿意为了这件事专门搭一套 LaTeX 环境。

这时候在线转换是最省事的。

通常流程就是：

输入 LaTeX
↓
实时渲染
↓
调整颜色 / 背景
↓
导出 PNG 或 SVG

例如：

\frac{1}{\sqrt{2\pi\sigma^2}}
e^{-\frac{(x-\mu)^2}{2\sigma^2}}

如果只是临时处理公式，可以用类似 LaTeX To Image 这样的网页工具直接生成 PNG 或 SVG。

这种方式的主要优势不是“功能更多”，而是：

省掉配置环境的时间。

比较适合偶发需求。

---

8. 方法五：使用 Overleaf + standalone

如果本身已经有 LaTeX 环境，也可以使用 standalone 文档类生成独立公式。

例如：

\documentclass{standalone}

\begin{document}

\[
E = mc^2
\]

\end{document}

编译以后可以得到一个尺寸比较紧凑的 PDF。

然后再把 PDF 转换成 SVG 或 PNG。

这种方式的好处是：

• 使用完整 LaTeX 引擎
• 复杂公式兼容性更好
• 可以使用更多宏包
• 输出效果稳定

---

9. 使用 ImageMagick 转 PNG

如果已经生成 PDF，也可以在命令行里继续转换。

例如使用 ImageMagick：

magick -density 300 formula.pdf formula.png

这里的：

-density 300

表示使用较高 DPI 渲染。

如果导出的 PNG 太模糊，可以适当提高 DPI。

例如：

magick -density 600 formula.pdf formula.png

但需要注意：

DPI 越高，最终图片体积通常也越大。

---

10. PDF 转 SVG

如果目标是网页或高清文档，也可以把 PDF 转 SVG。

例如使用 pdf2svg：

pdf2svg formula.pdf formula.svg

流程就变成：

LaTeX
↓
PDF
↓
SVG

虽然步骤比在线转换多一点，但优点是整个流程可以自动化。

如果有几十个甚至几百个公式需要批量生成，就比较适合脚本处理。

---

11. 方法六：Web 项目里直接使用 MathJax

对于 Web 项目，其实最好不要先转成图片。

MathJax 就是很成熟的方案。

例如：

<script>
window.MathJax = {
  tex: {
    inlineMath: [['$', '$'], ['\\(', '\\)']]
  }
};
</script>

页面中：

<p>
  The formula is \( E = mc^2 \).
</p>

MathJax 会自动渲染公式。

这种方式更适合：

• 博客系统
• 文档网站
• 在线教程
• 数学网站
• Wiki

---

12. KaTeX 也是一种选择

如果比较关注渲染速度，也可以考虑 KaTeX。

JavaScript 示例：

katex.render(
  "E = mc^2",
  document.getElementById("formula")
);

对应 HTML：

<div id="formula"></div>

KaTeX 的特点是：

• 渲染速度快
• 适合前端项目
• API 比较简单

不过对于特别复杂的 LaTeX，MathJax 和完整 TeX 环境通常兼容性更好一些。

---

13. 为什么在线转换工具有时候无法识别 LaTeX？

这里有一个比较容易混淆的地方。

LaTeX 本身不仅仅是数学公式语言。

例如：

\frac{a}{b}

属于典型的数学公式。

大部分 MathJax、KaTeX 或在线转换器都能处理。

但是下面这种：

\usepackage{tikz}

或者：

\begin{tikzpicture}
...
\end{tikzpicture}

就不只是单纯的公式了。

它需要真正的 LaTeX 编译环境。

类似的还有：

• 自定义宏
• 特殊宏包
• TikZ
• PGFPlots
• 完整论文模板

这类内容建议直接使用：

TeX Live
MiKTeX
Overleaf

而不是轻量级公式渲染器。

---

14. 为什么 PNG 公式会变模糊？

一般来说有三个原因。

原图分辨率太低

比如：

原图宽度：200 px

最后显示：

800 px

这相当于直接放大 4 倍。

---

平台进行了压缩

部分 CMS、聊天软件、内容平台会自动压缩上传图片。

所以本地看起来很清晰，上传以后可能会变糊。

---

反复处理图片

例如：

生成 PNG
↓
截图
↓
重新缩放
↓
再次截图

会不断损失质量。

---

15. 如果需要批量转换怎么办？

批量处理时，我更建议使用：

LaTeX
↓
PDF
↓
脚本转 PNG / SVG

例如目录里有：

formula-001.tex
formula-002.tex
formula-003.tex
...

可以通过 Shell、Python 等方式批量调用 LaTeX 编译器和图片转换程序。

相比手工打开网页逐个转换，这种方式更适合：

• 题库系统
• 教学平台
• 数学内容网站
• 自动生成报告
• 批量文档生产

---

16. 不同场景下我的选择

最后简单整理一下。

场景	推荐方案
临时发一个公式	截图
Word	PNG
普通 PPT	PNG
深色 PPT	透明 PNG
高清 PPT	SVG
技术博客	SVG / MathJax
Web 项目	MathJax / KaTeX
海报	SVG
复杂 LaTeX	Overleaf / TeX Live
批量生成	LaTeX + 脚本
临时在线转换	在线 LaTeX 转图片工具

---

17. 最后

其实 LaTeX 转图片这件事并没有一个“唯一正确”的方案。

主要还是看用途。

如果只是偶尔用一次：

在线转换 / 截图

就已经够了。

如果比较在意清晰度：

SVG

通常更合适。

如果是网站：

MathJax / KaTeX

往往比图片更好。

而如果是复杂公式、TikZ 或者需要批量处理：

完整 LaTeX 环境 + 自动化脚本

会更加稳定。

简单总结就是：

能直接渲染就不要转图片；必须转图片时，普通场景选 PNG，需要缩放时优先 SVG。

这样基本可以覆盖大多数实际需求。