MDUtil

Markdown 彩色文字

Markdown 本身不能改变文字颜色。本文介绍可行的办法：在保留 HTML 样式的编辑器里直接写样式，在会去掉样式的 GitHub 和 Discord 里使用替代写法。

简短回答

Markdown 怎么改变文字颜色？

Markdown 没有颜色语法。在保留 HTML 样式的编辑器里，例如 VS Code、Typora 和 Obsidian，可以写 <span style="color: red">文字</span>。GitHub 会去掉样式，在那里可以用 LaTeX 公式 $\color{red}{\text{文字}}$ 显示彩色文字，或者用 diff 代码块给整行上色。

Markdown
$\color{#d1242f}{\text{红色文字}}$ 和 $\color{#1a7f37}{\text{绿色文字}}$

显示效果

红色文字\color{#d1242f}{\text{红色文字}} 和 绿色文字\color{#1a7f37}{\text{绿色文字}}

给文字上色的方法

每种方法只在部分应用里有效，说明里写明了适用的地方。

带样式的 HTML

保留样式的地方最直接的写法。GitHub、GitLab 和很多网站会去掉 style 属性，只显示普通文字。

Markdown
这个词是<span style="color: #d1242f">红色</span>的。

仅适用于 VS Code、Typora 和 Obsidian。其他 Markdown 应用的显示效果不同，因此不提供预览。

公式里的 LaTeX 颜色

\color 和 \textcolor 会给公式里后面的内容上色。文字要放进 \text{}，才能保留正常的字形和间距。

Markdown
$\textcolor{#d1242f}{\text{失败}}$ · $\textcolor{#1a7f37}{\text{通过}}$

显示效果

失败\textcolor{#d1242f}{\text{失败}} · 通过\textcolor{#1a7f37}{\text{通过}}

用 diff 显示红绿行

在 diff 代码块里，以 + 开头的行显示为绿色，以 - 开头的行显示为红色。

Markdown
```diff
+ 第 2 版新增
- 第 2 版删除
```

显示效果

+ 第 2 版新增
- 第 2 版删除

用彩色表情做标记

表情符号自带颜色，在聊天软件和纯文本里也能显示。

Markdown
🔴 失败 · 🟡 进行中 · 🟢 通过

显示效果

🔴 失败 · 🟡 进行中 · 🟢 通过

用 GitHub 提示框显示彩色区块

GitHub 会把以 [!NOTE]、[!TIP]、[!WARNING] 等开头的引用显示成彩色提示框。

Markdown
> [!WARNING]
> 这个提示框在 GitHub 上是黄色的。

仅适用于 GitHub。其他 Markdown 应用的显示效果不同，因此不提供预览。

Discord：ANSI 颜色代码

在 ansi 代码块里，Discord 电脑版会给 [31m（红色）这类颜色代码后面的文字上色，手机版显示为普通文字。每个代码都以一个看不见的转义字符开头，复制按钮会保留它。

Markdown
```ansi
红色文字 和 绿色文字
```

仅适用于 Discord。其他 Markdown 应用的显示效果不同，因此不提供预览。

各平台的彩色文字支持

能否显示颜色，取决于应用允许多少 HTML 和公式。

应用支持情况说明
GitHub有差异不支持 style 和 <font>，公式里的 LaTeX 颜色和 diff 代码块有效。
VS Code / Typora支持预览中支持 <span style="color: …">。
Obsidian支持阅读视图中支持 <span style="color: …">。
Notion有差异没有输入语法，用格式菜单给文字上色。
Discord有差异只有 ansi 和 diff 代码块里能显示颜色，ansi 的颜色只在电脑版显示。
Slack不支持消息不支持彩色文字。

常见问题

Markdown 能改变文字颜色吗？

Markdown 本身不能。允许 HTML 样式的地方可以用 <span style="color: red">文字</span>；像 GitHub 这样会去掉样式的地方，可以用 LaTeX 颜色、diff 代码块或表情符号。

GitHub 上怎么给文字上色？

GitHub 会去掉 style 属性和 <font> 标签。在公式里写 $\color{red}{\text{文字}}$ 可以显示彩色文字，diff 代码块可以把整行显示成绿色或红色。

<font color="red"> 还能用吗？

它是已经废弃的 HTML。有些编辑器仍然支持，但 GitHub 等很多网站会去掉它。

Discord 里怎么给文字上色？

用标成 ansi 的代码块加颜色代码，电脑版会显示颜色；也可以用 diff 代码块显示红绿行。普通消息没有颜色。

想高亮而不是改颜色怎么办？

用 <mark> 标签，详见 Markdown 高亮。

导出 PDF 或 Word 时颜色会保留吗？

公式里的 LaTeX 颜色可以在 Markdown 转 PDF 中打印出来。本站的工具和 GitHub 一样会去掉 HTML 的 style 属性。