Markdown Highlight Syntax
When people talk about Markdown "highlighting," they're actually referring to two different things — one is adding a background color to text like a highlighter pen, and the other is automatic syntax coloring in code blocks based on the programming language. These two use completely different syntax, and many people confuse them. Let's clear it all up today.
Text Highlighting: Mark Text Like a Highlighter Pen
Text highlighting adds a background color (usually yellow) to specific words in a paragraph — exactly like using a highlighter pen to mark important passages in a book.
Highlight Text with Double Equals ==highlight==
This is the simplest approach — wrap the text with two pairs of equals signs:
This sentence contains a ==very important word== that needs attention.When rendered, "very important word" appears with a yellow background and black text.
This syntax originated in several extended Markdown dialects and has now been adopted by many mainstream tools: Obsidian, Typora, Logseq, iA Writer, and VS Code (preview mode) all support ==text== for text highlighting [^1] [^2].
By the way, I use this syntax almost every day when taking notes in Obsidian — it's incredibly convenient for marking key points. However, I once exported my notes to HTML and discovered all highlights had vanished. After some digging, I found the export tool didn't support this syntax — more on compatibility later.
Highlight with the HTML <mark> Tag
If ==highlight== doesn't work in your environment, you can use the HTML5 <mark> tag. Nearly all Markdown renderers support inline HTML:
This sentence contains a <mark>very important word</mark> that needs attention.The result is the same as with double equals — the text gets a yellow background.
The advantage of <mark> is its exceptional compatibility. The top-voted answer on Stack Overflow for this topic recommends this approach, having accumulated over 220 upvotes [^1]. In environments like Google Colaboratory and Jupyter Notebook, <mark> is the only reliable way to highlight text.
You can also customize the highlight color by adding a style attribute:
<mark style="background-color: lightblue">Blue highlight</mark>
<mark style="background-color: #ffcccc">Red highlight</mark>However, be aware that GitHub strips inline styles, so custom colors won't work on GitHub [^3].
Add Background Color with <span>
This is another HTML approach, working on the same principle as <mark>:
<span style="background-color: #FFFF00">Yellow highlighted text</span>Compared to <mark>, <span> has weaker semantics (<mark> explicitly means "marked/highlighted" in HTML5), and it also gets its style attribute stripped on GitHub. So <mark> is generally recommended over <span> [^1].
Platform-Specific Highlight Syntax
A few niche tools use their own highlight syntax. Just be aware they exist — no need to memorize them:
| Tool | Syntax | Note |
|---|---|---|
| Roam Research | ^^highlight^^ | Double caret |
| Notejoy | ::highlight:: | Double colon |
| Some Wiki systems | ::: highlight\ncontent\n::: | Block-level highlight |
Honestly, unless you're using one of these tools, you don't need to worry about these syntaxes. Just remember ==highlight== and <mark>.
Platform Compatibility: Which Highlight Method Actually Works?
This is probably what most people care about. I've put together a table showing text highlighting support across major platforms:
| Platform | ==highlight== | <mark> | <mark style> | <span style> |
|---|---|---|---|---|
| Obsidian | ✅ | ✅ | ✅ | ✅ |
| Typora | ✅ (must enable in settings) [^4] | ✅ | ✅ | ✅ |
| VS Code Preview | ✅ | ✅ | ✅ | ✅ |
| Logseq | ✅ | ✅ | ✅ | ✅ |
| GitHub | ❌ | ❌ | ❌ | ❌ |
| GitLab | ❌ | ❌ | ❌ | ❌ |
| Jupyter Notebook | ❌ | ✅ | ❌ | ✅ |
| Google Colab | ❌ | ✅ | ❌ | ❌ |
Key takeaways:
- GitHub doesn't support text highlighting at all.
==isn't parsed, and HTML tags are stripped. If you need to highlight text in a GitHub README, your best alternatives are bold (**bold**) or inline code (`code`) for emphasis [^3]. - Obsidian and Typora offer the best experience — both
==syntax and<mark>work, with custom colors supported. - For Jupyter/Colab environments, stick with
<mark>for the most reliable results.
Code Syntax Highlighting: Automatic Coloring for Code Blocks
Now that we've covered text highlighting, let's talk about the other kind of "highlighting" — code syntax highlighting. This feature automatically colors keywords, strings, comments, and other elements in code blocks based on the programming language, improving readability.
Basic Syntax
Simply add the language name after the three backticks:
```javascript
function sayHello() {
console.log("Hello, World!");
}
When rendered, keywords like `function`, `console`, and `log` are automatically colored differently.
Without a language name, the code block gets a plain gray background with no syntax coloring:
````markdownfunction sayHello() { console.log("Hello, World!"); }
Inline Code as a Form of "Highlighting"
Text wrapped in single backticks displays as monospace font with a gray background:
In JavaScript, use `console.log()` to output content.Strictly speaking, this isn't highlighting — it marks text as "code." But visually, it does serve as an emphasis technique. Similar to Markdown bold and Markdown italic, inline code is a text formatting tool. However, keep in mind that inline code semantically means "code," not "important text" — don't wrap regular text in backticks just because it looks nice [^1].
Common Language Identifiers
| Language | Identifier | Language | Identifier |
|---|---|---|---|
| JavaScript | javascript or js | Python | python or py |
| HTML | html | CSS | css |
| Java | java | C/C++ | c / cpp |
| Go | go | Rust | rust |
| PHP | php | Ruby | ruby |
| SQL | sql | Shell | bash or shell |
| JSON | json | YAML | yaml |
| TypeScript | typescript or ts | Swift | swift |
In practice, most Markdown editors support hundreds of languages. The underlying rendering engine varies — Typora uses CodeMirror, Obsidian uses Prism.js, and GitHub uses Linguist [^5] [^6].
Code Highlight Themes
The color scheme for syntax highlighting depends on your tool's theme. Typora lets you switch themes from the theme menu, while VS Code follows the editor's color theme. If you're rendering Markdown on a website, popular libraries like highlight.js and Prism.js offer dozens of themes to choose from [^5].
A quick tip from experience: I once used highlight.js for code highlighting on a blog. The default theme looked great on a light background, but switching to dark mode resulted in terrible contrast. Switching to the GitHub Dark theme solved the issue. So always test your theme in dark mode too.
How to Choose: A Simple Decision Guide
Based on common use cases, here are my recommendations:
If you use Obsidian / Typora for notes:Go straight for ==highlighted text== — it's clean and intuitive. Need a different color? Use <mark style="background-color: xxx">.
If you're publishing to GitHub:Unfortunately, text highlighting is a no-go. Use bold for emphasis, or blockquotes (> quote) to call attention to important information.
If you're writing Jupyter Notebooks:Use <mark>highlighted text</mark> for the best compatibility.
If you're rendering on a website / blog:Use highlight.js or Prism.js for code highlighting on the frontend, and <mark> tags for text highlighting with CSS for custom styling.
For code blocks, always use triple backticks + language name — this works across all platforms.
FAQ
Does the Markdown Standard Support Highlighting?
The native Markdown specification (including CommonMark) does not include text highlighting syntax. ==highlight== is an extended syntax that hasn't been incorporated into the standard [^1] [^7]. However, mainstream tools like Obsidian and Typora support it, so it works fine in practice.
How to Highlight Text on GitHub?
GitHub's Markdown renderer doesn't support the == syntax and strips HTML tags. Use bold (**text**) for emphasis, or blockquotes (> text) to draw attention [^3].
Can I Change the Highlight Color?
<mark style="background-color: color"> works on platforms that support inline styles (Obsidian, Typora). GitHub doesn't support this. The ==highlight== syntax itself doesn't allow specifying a color — the color is determined by the renderer's theme.
How Many Languages Does Code Block Highlighting Support?
Major engines (highlight.js, Prism.js, Pygments) all support 100+ programming languages. On specific platforms, GitHub supports 500+ languages (via Linguist), and Obsidian supports the full Prism.js language list [^5] [^6].
References
[^1]: Stack Overflow — text highlight in markdown, top answer with 229 upvotes [^2]: Obsidian Help — Basic formatting syntax, official documentation [^3]: GitHub Community — Can you highlight text in Markdown files in different colors?[^4]: Stack Overflow comment — Typora requires enabling double-equals highlighting in Preferences → Markdown [^5]: Codebase HQ — Syntax Highlighting in Markdown[^6]: Obsidian Help — Syntax highlighting using Prism.js, see Prism supported languages[^7]: CommonMark Spec — Latest specification, currently does not include highlight syntax