iconmilk

Appearance

Markdown Examples ​

This page demonstrates the available markdown features and extensions in VitePress.

Typography & Formatting ​

Headings ​

H1 Heading ​

H2 Heading ​

H3 Heading ​

H4 Heading ​

H5 Heading ​
H6 Heading ​

Text Style ​

Bold, Italic, Strikethrough, Inline Code.

Blockquotes ​

This is a blockquote.

Multi-line blockquote with some bold text.

Horizontal Rule ​

Lists ​

Unordered ​

  • Item 1
  • Item 2
    • Sub Item 2.1
    • Sub Item 2.2

Ordered ​

  1. First
  2. Second
  3. Third

Task List ​

  • [x] Completed task
  • [ ] Incomplete task

Tables ​

SupportedStatusDescription
VitePressStableStatic Site Generator
VueStableJS Framework
MarkdownStandardMarkup Language
CategoryResource
A1
B1
A2
B2
B2
B3
A3
B3
B3
B3

Custom Containers ​

INFO

Info
This is an info box. Used for general information.

TIP

Tip
This is a tip. Used for helpful advice or shortcuts.

WARNING

Warning
This is a warning. Used for important caveats.

DANGER

Danger
This is a dangerous warning. Used for critical errors or data loss warnings.

Click to expand

This is a details block (collapsible). Hidden content goes here.

Code Blocks ​

Syntax Highlighting ​

js
export default {
  data () {
    return {
      msg: 'Highlighted!'
    }
  }
}

Line Highlighting ​

ts
// Highlight lines 1 and 4
export default {
  setup() {
    const count = ref(0)
    return { count }
  }
}

Line Numbers ​

css
.my-class {
  color: red;
}

Colored Diffs ​

ts
// [!code word:Hello]
const message = 'Hello World'
console.log(message)

Code Groups ​

bash
npm install
bash
pnpm install
bash
yarn install

Component Features ​

Badges ​

Use badges to highlight version numbers or status:

default^1.9.0betacaution

Vue Components in Markdown ​

You can use Vue components directly in markdown:

Custom HTML/Vue container with 2 dynamic calculation

Advanced ​

File Includes ​

You can include content from other files (requires valid path):

Table of Contents ​

Emoji ​

🎉 🚀 📝 ⚠️

Check out the official documentation for more.