Create titles and sections using # through ######.

# H1 Heading
## H2 Heading
### H3 Heading
#### H4 Heading
##### H5 Heading
###### H6 Heading

Use underlines with = and - for H1 and H2.

Heading 1
=========

Heading 2
---------

Make text bold with ** or __.

**This is bold**
__This is also bold__

Make text italic with * or _.

*This is italic*
_This is also italic_

Combine bold and italic with *** or ___.

***Bold and italic***
___Bold and italic___
**_Mixed bold italic_**
*__Mixed bold italic__*

Strike through text with ~~.

~~Strikethrough text~~
~~Multiple words strikethrough~~

Create subscript and superscript with HTML tags.

H<sub>2</sub>O
X<sub>n</sub>
X<sup>2</sup>
10<sup>th</sup>

Highlight text with == or <mark> tags.

==Highlighted text==
<mark>Highlighted with HTML</mark>

Use backticks for inline code.

Use `code` in your sentence.
Use ``code with `backticks` inside``

Create clickable links with optional title.

[Link Text](https://example.com "Optional Title")
<https://example.com>

Use reference-style links for cleaner text.

[Link text][reference]
[Another link][ref2]

[reference]: https://example.com "Title"
[ref2]: https://example.com

Wrap URLs and emails in < > for auto-linking.

<https://example.com>
<[email protected]>

Link to sections within the same document.

[Jump to Section](#section-name)
[Go to Headings](#headings)

Embed images with alt text and optional title.

![Alt text](https://picsum.photos/seed/picsum/200/200)
![Alt with title](https://picsum.photos/seed/picsum/200/200 "Image title")
[![Clickable image](https://picsum.photos/seed/picsum/200/200)](https://stackonlinetools.com)

[Reference style][logo]
[logo]: https://picsum.photos/seed/picsum/200/200 "Logo Title"

<img src="https://picsum.photos/seed/picsum/200/200" width="200" height="100" alt="Sized image">
<img src="https://picsum.photos/seed/picsum/200/200" style="float: right" alt="Floating image">

Rendered output:

[Reference style][logo] [logo]: https://picsum.photos/seed/picsum/200/200 "Logo Title"

Use -, *, or + to make bullet lists.

- Item 1
- Item 2
  - Nested Item
* Item 3
+ Item 4

Prefix items with numbers for ordered lists.

1. First
2. Second
3. Third
   1. Nested
   2. Nested

Track tasks with [ ] and [x] checkboxes.

- [x] Done item
- [ ] Pending item
- [ ] Another task

Create term and definition pairs.

First Term
: Definition of first term

Second Term
: First definition
: Second definition

Quote text with > at the start of the line.

> This is a blockquote
>
> - Can contain lists
> - And other markdown

Nest blockquotes with multiple > symbols.

> First level quote
>
>> Nested quote
>>
>>> Third level

Include other markdown elements in blockquotes.

> ### Quote with heading
>
> - List item 1
> - List item 2
>
> **Bold text** in quote

Separate sections with --- or *** or ___.

---
***
___

Add two spaces at line end or use <br> for a break.

First line  
Second line (two spaces at end)

Or use HTML:<br>
Line with HTML break

Separate paragraphs with blank lines.

This is the first paragraph.

This is the second paragraph.

This is the third paragraph.

Fence blocks with triple backticks and optional language.

```js
function greet(name) {
  console.log(`Hello, ${name}`);
}
```

function greet(name) {
  console.log(`Hello, ${name}`);
}

Indent with 4 spaces or 1 tab for code blocks.

    // Code block with indentation
    function example() {
      return true;
    }

// Code block with indentation
function example() {
  return true;
}

Syntax highlighting for JavaScript.

```javascript
// JavaScript Example
function greeting(name) {
  return `Hello, ${name}!`;
}
const result = greeting('World');
console.log(result);
```

// JavaScript Example
function greeting(name) {
  return `Hello, ${name}!`;
}
const result = greeting('World');
console.log(result);

Syntax highlighting for Python.

```python
# Python Example
def fibonacci(n):
    a, b = 0, 1
    while a < n:
        print(a, end=' ')
        a, b = b, a + b
```

# Python Example
def fibonacci(n):
    a, b = 0, 1
    while a < n:
        print(a, end=' ')
        a, b = b, a + b

Syntax highlighting for CSS.

```css
/* CSS Example */
.container {
  display: flex;
  justify-content: center;
  align-items: center;
}
```

/* CSS Example */
.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

Syntax highlighting for JSON.

```json
{
  "name": "Example",
  "version": "1.0.0",
  "dependencies": {
    "package": "^1.0.0"
  }
}
```

{
  "name": "Example",
  "version": "1.0.0",
  "dependencies": {
    "package": "^1.0.0"
  }
}

Syntax highlighting for shell commands.

```bash
# Install dependencies
npm install

# Run the application
npm start
```

# Install dependencies
npm install

# Run the application
npm start

Syntax highlighting for TypeScript.

```typescript
interface User {
  name: string;
  email: string;
  age?: number;
}

const user: User = {
  name: "John",
  email: "[email protected]"
};
```

interface User {
  name: string;
  email: string;
  age?: number;
}

const user: User = {
  name: "John",
  email: "[email protected]"
};

Syntax highlighting for HTML.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Page Title</title>
</head>
<body>
  <h1>Hello World</h1>
</body>
</html>
```

<!DOCTYPE html>
<html>
<head>
  <title>Page Title</title>
</head>
<body>
  <h1>Hello World</h1>
</body>
</html>

Create pipe tables with header and rows.

| Header 1 | Header 2 | Header 3 |
|----------|----------|----------|
| Cell 1   | Cell 2   | Cell 3   |
| Row 2    | Data     | Data     |

Use :---, :---:, ---: for left/center/right alignment.

| Left | Center | Right |
|:-----|:------:|------:|
| Left | Center | Right |
| Text | Text   | Text  |

Showcase a richer table with emojis and varied content.

| Feature        | Basic       | Pro        | Enterprise    |
|----------------|-------------|------------|---------------|
| Storage        | 10 GB ⚡     | 100 GB 🚀  | Unlimited 💫  |
| Users          | 1           | 10         | Unlimited     |
| Speed          | Standard    | Fast       | Fastest       |
| Support        | ✅           | ✅         | ✅            |
| Custom Theme   | ❌           | ✅         | ✅            |

Mix math equations inline with table cells.

| Variable | Formula | Value |
|:---------|:--------|------:|
| Energy   | $E = mc^2$ | 9.0 × 10^16 J |
| Force    | $F = ma$   | 100 N |
| Sum      | $\sum_{i=1}^n i$ | 5050 |

Add inline math equations with single $.

The equation $E = mc^2$ shows mass-energy equivalence.

Pythagorean theorem: $a^2 + b^2 = c^2$

Display math equations on their own line with $$.

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

$$
\int_{0}^{\infty} e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
$$

Write systems of equations and cases.

$$
\begin{cases}
x + y = 10 \\
2x - y = 5
\end{cases}
$$

Create matrices and arrays with LaTeX.

$$
\begin{matrix}
1 & 2 & 3 \\
4 & 5 & 6 \\
7 & 8 & 9
\end{matrix}
$$

$$
\begin{pmatrix}
a & b \\
c & d
\end{pmatrix}
$$

Complex mathematical expressions with integrals, limits, and summations.

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

$$
\lim_{x \to \infty} \frac{1}{x} = 0
$$

$$
\sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6}
$$

$$
\alpha + \beta = \gamma
$$

Add footnotes with [^label] syntax.

Here's a sentence with a footnote.[^1]

Another reference.[^note]

[^1]: This is the footnote.
[^note]: Named footnote.

Use emoji shortcodes or Unicode characters.

:smile: :heart: :thumbsup:

Or direct: 😀 ❤️ 👍

Use backslash to escape special characters.

\* Not italic \*
\# Not a heading
\[Not a link\](url)
\`Not code\`

Use raw HTML for advanced formatting.

<div style="background: #f0f0f0; padding: 10px;">
  <p>Custom HTML content</p>
</div>

<details>
  <summary>Click to expand</summary>
  Hidden content here
</details>

Add hidden comments using HTML syntax.

<!-- This is a comment -->

Visible text

<!-- This won't appear in output -->

Add badges using image links (shields.io).

![Build Status](https://img.shields.io/github/workflow/status/user/repo/CI)
![Version](https://img.shields.io/npm/v/package.svg)
![License](https://img.shields.io/badge/license-MIT-blue.svg)

Create expandable sections with <details>.

<details>
  <summary>Click to expand</summary>
  
  ## Hidden Content
  This content is hidden until clicked.
  
  - Item 1
  - Item 2
</details>

Display keyboard keys with <kbd> tags.

Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy.

Use <kbd>⌘</kbd> + <kbd>V</kbd> to paste on Mac.

Define abbreviations with hover text.

The HTML specification is maintained by the W3C.

*[HTML]: Hyper Text Markup Language
*[W3C]: World Wide Web Consortium

Add colored text using HTML/CSS.

<span style="color: red">Red text</span>
<span style="color: #0066cc">Blue text</span>
<span style="color: green">Green text</span>

Create custom anchor points for linking.

<a name="custom-anchor"></a>

## Section Title {#custom-id}

[Link to anchor](#custom-anchor)
[Link to section](#custom-id)

Create colored alert boxes with blockquotes and emoji.

> ℹ️ **Note**
> This is an informational note.

> ⚠️ **Warning**
> This is a warning message.

> ✅ **Success**
> Operation completed successfully.

> ❌ **Error**
> An error occurred.

Special Markdown features for GitHub.

- [x] Task list item
- [ ] Open task
- [x] Completed task

```diff
- removed line
+ added line
```

> **Note**
> Special callout syntax

> **Warning**
> Warning callout

- removed line
+ added line

Create flowcharts and diagrams with Mermaid syntax.

```mermaid
graph TD;
    A[Start] --> B{Decision};
    B -->|Yes| C[Action 1];
    B -->|No| D[Action 2];
    C --> E[End];
    D --> E;
```

graph TD;
    A[Start] --> B{Decision};
    B -->|Yes| C[Action 1];
    B -->|No| D[Action 2];
    C --> E[End];
    D --> E;

Create sequence diagrams with Mermaid.

```mermaid
sequenceDiagram
    participant User
    participant Server
    User->>Server: Request
    Server-->>User: Response
```

sequenceDiagram
    participant User
    participant Server
    User->>Server: Request
    Server-->>User: Response

Starter outline for research papers with sections and math.

# Research Paper Title
## Abstract
Research summary...

## Introduction
### Background
Background information...

### Literature Review
Previous research...

## Methodology
### Research Design
- Data collection
- Analysis
- Results

### Data Analysis
$$\chi^2 = \sum\frac{(O_i-E_i)^2}{E_i}$$

## Results
| Variable | Group A | Group B |
|----------|---------|---------|
| X | 10.5 | 11.2 |
| Y | 20.1 | 19.8 |

## References
[^1]: Author, A. (2023). Title...

Document API endpoints, parameters, and responses.

# API Documentation

## Authentication
```http
Authorization: Bearer <token>
```

## Endpoints

### GET /api/users
Retrieve users list.

#### Parameters
| Name | Type | Description |
|------|------|-------------|
| page | number | Page number |
| limit | number | Items per page |

#### Response
```json
{
  "users": [],
  "total": 100
}
```

### POST /api/users
Create new user.

#### Request Body
```typescript
interface CreateUser {
  name: string;
  email: string;
}
```

#### Error Codes
| Code | Description |
|------|-------------|
| 400 | Bad Request |
| 401 | Unauthorized |

Authorization: Bearer <token>

{
  "users": [],
  "total": 100
}

interface CreateUser {
  name: string;
  email: string;
}

Complete project README with badges and sections.

# Project Name

![Build Status](https://img.shields.io/github/workflow/status/user/repo/CI)
![npm version](https://img.shields.io/npm/v/project.svg)

## Getting Started

```bash
npm install my-project
npm start
```

## Features

✨ Feature 1
🚀 Feature 2
💫 Feature 3

## Documentation

See our [documentation](/docs) for more details.

## Contributing

Please read [CONTRIBUTING.md](CONTRIBUTING.md)

## License

MIT © [Your Name]

npm install my-project
npm start

Format blog posts with frontmatter and structure.

---
title: "Blog Post Title"
date: 2024-01-01
author: "Your Name"
tags: ["tech", "tutorial"]
---

# Eye-catching Title

![Header Image](https://picsum.photos/seed/picsum/800/300)

## Introduction

Engaging opening paragraph...

### Key Points

1. First point with **emphasis**
2. Second point with *style*

> Quotable highlight text

## Code Example

```python
def example():
    print("Hello, readers!")
```

### Summary

Key takeaways...

def example():
    print("Hello, readers!")

Best practices for creating readable tables.

## Basic Table

| Header 1 | Header 2 |
|----------|----------|
| Cell 1   | Cell 2   |

## Table with Alignment

| Left | Center | Right |
|:-----|:------:|------:|
| L    | C      | R     |

## Pro Tips

- Use a **Table Generator** for complex tables
- Align pipes for readability
- Test in live preview before finalizing

Comprehensive formatting examples for common use cases.

# Markdown Formatting Examples
## Text Styles
**Bold text** for emphasis
*Italic text* for subtle emphasis
~~Strikethrough~~ for corrections
`Inline code` for technical terms

## Document Structure
# Main Title
## Section Header
### Subsection
#### Minor Section

## Lists and Tasks
- [x] Completed task
- [ ] Pending task
- Regular bullet point

1. First step
2. Second step
3. Final step

## Quotes and Code
> "Markdown makes writing for the web fast and easy."

```javascript
function hello() {
  console.log("Hello, Markdown!");
}
```

function hello() {
  console.log("Hello, Markdown!");
}