Markdown Formats

This page demonstrates all supported Markdown formats.

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Text Formatting

Bold text using **text**

Italic text using *text*

Bold and italic using ***text***

~~Strikethrough~~ using ~~text~~

Inline code using backticks

Links

External link

Link with title

Relative link

Images

Alt text

Lists

Unordered Lists

Item 1
Item 2
- Nested item 2.1
- Nested item 2.2
Item 3

Ordered Lists

First item
Second item
1. Nested item 2.1
2. Nested item 2.2
Third item

Task Lists

[x] Completed task
[ ] Incomplete task
[ ] Another incomplete task

Code Blocks

JavaScript


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

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

Python


  
    
    
    
  
  def greet(name):
    print(f"Hello, {name}!")

greet("World")

  def greet(name):
    print(f"Hello, {name}!")

greet("World")

Shell


  
    
    
    
  
  npm install
npm run dev

  npm install
npm run dev

Without syntax highlighting


  
    
    
    
  
  Plain code block
without language

  Plain code block
without language

Blockquotes

This is a blockquote.

It can span multiple lines.

Nested blockquote

Back to first level

Horizontal Rules

Tables

Name	Age	Occupation
John	30	Engineer
Jane	25	Designer
Bob	35	Manager

Table with alignment

Left	Center	Right
L1	C1	R1
L2	C2	R2

HTML

You can use inline HTML within Markdown.

This is a div with inline styles.

Escaping Characters

Use backslash to escape special characters: *not italic*, `not code`

Line Breaks

Line break with two spaces at the end.
New line starts here.

Or use double line break for new paragraph.

Emojis

:smile: :heart: :star: (if GFM is enabled)

Automatic Links

https://example.com

user@example.com

Definition Lists (if supported)

Term 1 : Definition 1

Term 2 : Definition 2a : Definition 2b

Footnotes (if supported)

This is a reference[^1].

[^1]: This is the footnote content.

Callouts

mdsvr supports two callout syntaxes:

GitHub-style Callouts

Use [!TYPE] in blockquotes:

example:


  
    
    
    
  
  > [!NOTE]
> This is a note callout.

> [!TIP]
> This is a tip callout.

> [!WARNING]
> This is a warning callout.

> [!CAUTION]
> This is a caution callout.

> [!IMPORTANT]
> This is an important callout.

> [!SUCCESS]
> This is a success callout.

  > [!NOTE]
> This is a note callout.

> [!TIP]
> This is a tip callout.

> [!WARNING]
> This is a warning callout.

> [!CAUTION]
> This is a caution callout.

> [!IMPORTANT]
> This is an important callout.

> [!SUCCESS]
> This is a success callout.

renders as:

📝 Note

This is a note callout.

💡 Tip

This is a tip callout.

⚠️ Warning

This is a warning callout.

🚫 Caution

This is a caution callout.

⭐ Important

This is an important callout.

✅ Success

This is a success callout.

Triple-colon Callouts

Use :::type content ::: syntax:

example:


  
    
    
    
  
  :::note This is a note callout using triple-colon syntax. :::

:::tip This is a tip callout using triple-colon syntax. :::

:::warning This is a warning callout using triple-colon syntax. :::

:::danger This is a danger callout using triple-colon syntax. :::

:::info This is an info callout using triple-colon syntax. :::

:::success This is a success callout using triple-colon syntax. :::

  :::note This is a note callout using triple-colon syntax. :::

:::tip This is a tip callout using triple-colon syntax. :::

:::warning This is a warning callout using triple-colon syntax. :::

:::danger This is a danger callout using triple-colon syntax. :::

:::info This is an info callout using triple-colon syntax. :::

:::success This is a success callout using triple-colon syntax. :::

renders as:

📝 Note

This is a note callout using triple-colon syntax.

💡 Tip

This is a tip callout using triple-colon syntax.

⚠️ Warning

This is a warning callout using triple-colon syntax.

🚫 Danger

This is a danger callout using triple-colon syntax.

ℹ️ Info

This is an info callout using triple-colon syntax.

✅ Success

This is a success callout using triple-colon syntax.

Supported Types

note / NOTE → Info (ℹ️)
tip / TIP → Tip (💡)
warning / WARNING → Warning (⚠️)
caution / CAUTION → Danger (🚫)
important / IMPORTANT → Info (ℹ️)
info / INFO → Info (ℹ️)
danger / DANGER → Danger (🚫)
success / SUCCESS → Success (✅)

Mermaid Diagrams

mdsvr supports Mermaid diagrams via the mermaid code block:

Database Schema Diagram


  
    
    
    
  
  
    
    
  
  
    erDiagram
    USER {
        int id PK
        string email
        string username
        datetime created_at
    }
    POST {
        int id PK
        string title
        text content
        int author_id FK
        datetime published_at
    }
    COMMENT {
        int id PK
        text body
        int post_id FK
        int author_id FK
        datetime created_at
    }
    TAG {
        int id PK
        string name
        string slug
    }
    POST_TAG {
        int post_id FK
        int tag_id FK
    }

    USER ||--o{ POST : writes
    USER ||--o{ COMMENT : writes
    POST ||--o{ COMMENT : has
    POST ||--o{ POST_TAG : tagged
    TAG ||--o{ POST_TAG : assigned
  
  erDiagram
    USER {
        int id PK
        string email
        string username
        datetime created_at
    }
    POST {
        int id PK
        string title
        text content
        int author_id FK
        datetime published_at
    }
    COMMENT {
        int id PK
        text body
        int post_id FK
        int author_id FK
        datetime created_at
    }
    TAG {
        int id PK
        string name
        string slug
    }
    POST_TAG {
        int post_id FK
        int tag_id FK
    }

    USER ||--o{ POST : writes
    USER ||--o{ COMMENT : writes
    POST ||--o{ COMMENT : has
    POST ||--o{ POST_TAG : tagged
    TAG ||--o{ POST_TAG : assigned