Markdown Rendering Test
A comprehensive test of all markdown elements and syntax
This document tests all markdown rendering capabilities.
Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Text Formatting
Regular text paragraph with bold text, italic text, bold and italic, strikethrough, and inline code.
You can also use underscores for emphasis and double underscores for strong emphasis.
Links and References
Inline link Link with title https://auto-linked-url.com
Lists
Unordered List
- First item
- Second item
- Third item
- Nested item 1
- Nested item 2
- Deeply nested item
- Fourth item
Ordered List
- First item
- Second item
- Third item
- Nested numbered item
- Another nested item
- Fourth item
Mixed List
- First ordered item
- Unordered nested item
- Another unordered item
- Second ordered item
- Nested ordered item
- Mixed with unordered
Task List
- Completed task
- Incomplete task
- Another completed task
- Nested incomplete task
- Nested completed task
Blockquotes
This is a simple blockquote.
This is a multi-line blockquote. It continues on the next line. And keeps going.
Blockquotes can be nested.
This is a nested blockquote.
Even deeper nesting.
Blockquotes can contain formatting and
code.They can also contain multiple paragraphs.
Code
Inline Code
Use const variable = value for inline code snippets.
Code Blocks
Plain code block without syntax highlighting:
function example() {
return "no highlighting"
}
JavaScript:
function greet(name) {
console.log(`Hello, ${name}!`);
return true;
}
const arrow = (x) => x * 2;
TypeScript:
interface User {
id: number;
name: string;
email?: string;
}
function getUser(id: number): User {
return { id, name: "John" };
}
Python:
def fibonacci(n: int) -> int:
"""Calculate fibonacci number."""
if n <= 1:
return n
return fibonacci(n - 1) + fibonacci(n - 2)
class Example:
def __init__(self, value):
self.value = value
Bash:
#!/bin/bash
echo "Hello, World!"
ls -la /home
grep -r "pattern" .
JSON:
{
"name": "test",
"version": "1.0.0",
"dependencies": {
"astro": "^4.0.0"
},
"nested": {
"array": [1, 2, 3]
}
}
CSS:
.container {
display: flex;
justify-content: center;
align-items: center;
background: linear-gradient(to right, #667eea, #764ba2);
}
@media (max-width: 768px) {
.container {
flex-direction: column;
}
}
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test Page</title>
</head>
<body>
<div class="container">
<h1>Hello World</h1>
</div>
</body>
</html>
Tables
Simple Table
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Row 1 | Data | More |
| Row 2 | Data | More |
| Row 3 | Data | More |
Aligned Table
| Left Aligned | Center Aligned | Right Aligned |
|---|---|---|
| Left | Center | Right |
| Text | Text | Text |
| More | More | More |
Table with Formatting
| Feature | Syntax | Example |
|---|---|---|
| Bold | **text** | bold |
| Italic | *text* | italic |
| Code | `code` | code |
| Link | [text](url) | link |
Horizontal Rules
Three or more dashes:
Three or more asterisks:
Three or more underscores:
Images
Nested Elements
- First ordered item
- Unordered nested
- Another unordered
A blockquote within a list
With multiple lines
- Back to list
// Code block in a list const x = 42;
- Second ordered item
Special Characters and Escaping
Backslash escaping: * _ # [ ] ( )
Automatic escaping: AT&T, 4 < 5, 5 > 4
Definition Lists
Term 1 : Definition of term 1
Term 2 : Definition of term 2 : Another definition of term 2
Footnotes
Here’s a sentence with a footnote reference.1
Here’s another with a longer footnote.2
Line Breaks
This line ends with two spaces. So this starts on a new line.
This line ends with a backslash.
Also starts on a new line.
Edge Cases
Empty Lines and Spacing
Paragraph 1
Paragraph 2 with multiple blank lines above
Long Lines
This is a very long line of text that should wrap automatically in most renderers and demonstrates how the markdown parser handles extremely long continuous text without any line breaks or formatting which can sometimes cause issues in certain implementations but should work fine in most modern markdown renderers.
Mixed Content
Quote containing a list:
- Item 1
- Item 2
And a code block:
code hereAnd a table:
Col 1 Col 2 A B
Unicode and Emoji
Emoji: 🎉 🚀 ✨ 💻 📝
Unicode: café, résumé, naïve, Zürich
Math symbols: ∞ ≈ ≠ ± × ÷
Arrows: → ← ↑ ↓ ⇒ ⇐
HTML in Markdown
content
Click to expand
Hidden content in a details element.
- Can contain markdown
- Lists, formatting, etc.
const code = "works too";
Complex Nesting Example
-
First level
Quote in list
- Nested list
def nested_code(): return "in list" - Back to nested list
Table In List Item
- Nested list
-
Second level
- Nested ordered
- Mixed with unordered
Quote in nested list
Double nested quote
- Mixed with unordered
- Continue ordered
- Nested ordered
End
This concludes the markdown rendering test.