Markdown Code Blocks

Markdown code blocks preserve indentation, whitespace, and special characters exactly as written, which makes them ideal for source code, terminal commands, configuration files, and other preformatted text.

```javascript
console.log("Hello, World!");
```

For short snippets inside a sentence, use single backticks instead. Need a refresher on basic formatting? See the Markdown Syntax Guide.

The most common method is a fenced code block using three backticks.

💡 Practice as you read: Try each example in the Markdown Editor with live preview.

Markdown provides two ways to display code.

Inline code#

Use inline code for short commands, filenames, variables, or small snippets inside a sentence.

Run `npm install` before starting the project.

Output

Fenced code blocks#

Use a fenced block when the example contains multiple lines or needs preserved indentation.

```bash
npm install
npm run dev
```

Fenced blocks suit programming examples, terminal commands, configuration files, JSON, SQL queries, HTML snippets, and README documentation.

💡 Simple rule: Use inline code for short text inside a sentence, and fenced code blocks for multi-line content.

A fenced code block starts and ends with matching fences.

```text
Hello World
```

Everything inside the fence is treated as literal content. Markdown characters such as #, *, _, and [] appear as written instead of being interpreted as formatting.

To request syntax highlighting, add a language identifier immediately after the opening fence.

```language
Your code here
```

For example:

```python
print("Hello, World!")
```

The exact highlighting result depends on the Markdown renderer and whether it supports that language.

These identifiers are commonly used in Markdown documentation:

If a renderer does not recognize the language identifier, the code block usually still displays normally, but syntax highlighting may not appear.

The following examples cover formats developers use most often in README files, developer documentation, tutorials, and API references.

JavaScript#

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

greet("MDConvertHub");

Python#

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

greet("MDConvertHub")

Bash#

npm install
npm run dev

JSON#

{
  "success": true,
  "message": "User created successfully",
  "id": 123
}

YAML#

name: Build

on:
  push:
    branches:
      - main

Dockerfile#

FROM node:20

WORKDIR /app

COPY . .

RUN npm install

CMD ["npm", "start"]

You can place a fenced code block inside a list item by indenting it correctly.

1. Install dependencies.

   ```bash
   npm install
   npm run dev
   ```

2. Start the development server.

The indentation keeps the code block associated with the list item.

If you need to show code inside a standard Markdown table, inline code is usually the safer choice. Support for multi-line fenced blocks inside table cells varies between renderers.

Indented code blocks#

Markdown also supports code blocks created with four leading spaces.

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

Indented blocks are valid, but fenced blocks are usually easier to edit and can support language-specific syntax highlighting.

Showing backticks inside a code block#

If your example needs to contain triple backticks, use a longer fence around the outer block.

````markdown
```javascript
console.log("Hello");
```
````

The longer outer fence prevents Markdown from closing the block too early.

Using tildes instead of backticks#

Many Markdown renderers also support tildes as fences.

~~~python
print("Hello, World!")
~~~

This can be useful when the content already contains multiple backticks.

💡 Tip: Pick one fence style and use it consistently throughout a document unless there is a reason to switch.

Fenced code blocks are widely supported, but syntax highlighting and available language identifiers can vary by renderer.

For GitHub-specific Markdown behavior, see the GitHub Flavored Markdown Guide.

If you publish the same Markdown on multiple platforms, preview it on the target platform before relying on a particular highlighting feature.

• Use fenced blocks for multi-line code and commands.
• Add a language identifier when syntax highlighting improves readability.
• Keep each example focused on one concept.
• Use realistic, copyable examples where possible.
• Keep indentation consistent.
• Separate unrelated examples into different blocks.
• Use inline code for short commands, filenames, variables, and keywords.
• Preview the rendered output before publishing documentation.

💡 Workflow tip: Check formatting in the live Markdown editor before converting your document with Markdown to PDF.