Most Markdown processors allow you to drop raw HTML directly into your Markdown source. This is useful for things Markdown cannot do natively — such as controlling text colour, centring a block, adding a collapsible section, or embedding a video player.
<p style="color: steelblue;">This text is blue in HTML output.</p>
<div style="text-align: center;">This whole block is centred.</div>
<details>
<summary>Click to expand</summary>
Hidden content revealed on click.
</details>
This text is blue in HTML output.
Click to expand
Hidden content revealed on click.Best Practice
- Use inline HTML only when Markdown cannot achieve the result. Over-using it defeats the purpose of writing in Markdown — readability and portability.
- Always leave a blank line between an HTML block and any surrounding Markdown content. Without it, some parsers may misinterpret the HTML or fail to render the Markdown around it correctly.
- Avoid
style=attributes if your site uses a stylesheet — use CSS classes viaclass=instead for consistency. - Test inline HTML in your target renderer before relying on it. HTML pass-through is not universal, and what renders in one tool may be stripped in another.
- Avoid inline HTML in documents that will also be converted to PDF or EPUB — the HTML may be dropped or cause unexpected output in those formats.
Notes
When HTML is Stripped
Some renderers strip inline HTML for security reasons. GitHub's rendered view removes style= attributes and most <div> elements. Platforms aimed at non-technical users — Obsidian, some CMS editors — may also sanitise or strip HTML. Always verify in your target environment.
Embedding Videos
A common use for inline HTML is embedding a video player from YouTube, Vimeo, or another service. Most platforms provide an embed code you can paste directly into your Markdown source.
<iframe width="560" height="315"
src="https://www.youtube.com/embed/example"
title="Video player"
allowfullscreen>
</iframe>
Security Considerations
Inline HTML that includes <script> tags or event handlers (such as onclick=) can be a security risk in shared or user-generated content environments. Most platforms strip these automatically. Only use inline HTML in controlled, trusted contexts — never in content submitted by other users.
Markdown Flavour Support
HTML pass-through is widely supported but behaviour varies, particularly around sanitisation.
Flavour Support Detail
| Flavour | Support | Notes |
|---|---|---|
| Original Markdown | Yes | HTML pass-through is a core feature of the original spec. |
| CommonMark | Yes | Well-defined rules for block and inline HTML; script and style tags sanitised in many renderers. |
| GitHub Flavored Markdown | Partial | HTML passed through with sanitisation; style= attributes stripped for security. |
| Pandoc Markdown | Partial | HTML respected in HTML and EPUB output; stripped or converted for PDF and other formats. |
Practical Examples
- Adding a collapsible spoiler section to a book review blog: The
<details>element is not available in Markdown but works natively in most browsers and Markdown CMS tools.
I genuinely did not see the ending coming.
<details>
<summary>Spoiler — click to reveal</summary>
It turns out the letter was written thirty years earlier, and the house had been hers all along.
</details>
I genuinely did not see the ending coming.
Spoiler — click to reveal
It turns out the letter was written thirty years earlier, and the house had been hers all along.- Embedding a YouTube video in a hobby blog post: Paste the embed code from YouTube's Share menu directly into your Markdown source to add a playable video to the page.
Here is my favourite demonstration from last year's baking weekend.
<iframe width="560" height="315"
src="https://www.youtube.com/embed/example"
title="Lemon drizzle cake tutorial"
allowfullscreen>
</iframe>
Here is my favourite demonstration from last year's baking weekend.
An embedded video player appears here in a live page.