---
title: 'Markdown Support'
description: 'LaRecipe automatically leverages Markdown to HTML parser out of the box.'
url: 'https://larecipe.saleem.dev/2.x/markdown-support'
version: 2.x
locale: en
last_updated: '2026-10-17'
---

> Docs index: https://larecipe.saleem.dev/2.x/llms.txt · MCP: https://larecipe.saleem.dev/mcp · Skill: https://larecipe.saleem.dev/skill.md

# Markdown Support

## Basics

Markdown elements automatically parsed into normal HTML tags.

**Typography**

Input:

```text
### H3
```

Output:

### H3

**Images**

Input:

```text
![image](url)
```

Output:

![cute image](https://media.tenor.com/images/f45c43d124468dc602a95baabadab70d/tenor.gif)

**Inline Code**

Input:

```text
Inline code is `cool`
```

Output:

Inline code is `cool`

**Code**

LaRecipe uses `prism.js` with code highlighting out of the box. LaRecipe supports all Prism supported languages.

Input:

\`\`\`php

echo 'LaRecipe is beautiful';

\`\`\`

Output:

```php
echo 'LaRecipe is beautiful';
```

## Tables

Markdown Tables automatically parsed and converted to nice looking rendered tables.

Input:

```markdown
| # | Name   | Age |
| : |   :-   |  :  |
| 1 | Saleem | 24  |
| 2 | John   | 25  |
| 3 | Ayman  | 26  |
```

Output:

| # | Name   | Age |
| : |   :-   |  :  |
| 1 | Saleem | 24  |
| 2 | John   | 25  |
| 3 | Ayman  | 26  |

## Alarms

LaRecipe provides beautiful looking alerts parsed directly from Markdown with extra sugar, all that you have to do is to prepend Markdown blockquote with `{type}` of your alert.

The supported alarms types are: **primary**, **success**, **info**, **danger**, **warning**.

Input:

```text
> {danger} Here is an example of danger alarm message
```

Output:

> [!CAUTION]
> Here is an example of danger colored alarm

You are also able to use font-awesome icons in alarms.

Input:

```text
> {danger.fa-close} Here is an example of a font awesome icon
```

Output:

> [!CAUTION]
> Here is an example of a font awesome icon

## Table of Content

By default, LaRecipe is considering the first `ul` element in your docs file as the table of content and it will appear on the top-right corner of your documentation for quick navigation.

> [!IMPORTANT]
> Each link in your table of content will be targeted to the corresponding **h2** element in your documentation file.

```text
- [Example](#example-link)

<a name="example-link">
## [Example](#example-link)
```