Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/gradio-app/gradio/llms.txt

Use this file to discover all available pages before exploring further.

The Markdown component renders markdown text with support for LaTeX, code blocks, and syntax highlighting.

Basic usage

import gradio as gr

md_text = """
# Hello World

This is **bold** and this is *italic*.

```python
print("Code block")
""" gr.Markdown(value=md_text)

## Constructor

<ParamField path="value" type="str | Callable | None" default="None">
  Markdown content to display
</ParamField>

<ParamField path="latex_delimiters" type="list[dict] | None" default="None">
  LaTeX delimiters. Defaults to `$$` for display math. Pass empty list to disable
</ParamField>

<ParamField path="sanitize_html" type="bool" default="True">
  If False, disables HTML sanitization (not recommended for security)
</ParamField>

<ParamField path="line_breaks" type="bool" default="False">
  If True, enables GitHub-flavored line breaks
</ParamField>

<ParamField path="header_links" type="bool" default="False">
  If True, creates anchors for headings with hover link icon
</ParamField>

<ParamField path="rtl" type="bool" default="False">
  If True, renders text right-to-left
</ParamField>

<ParamField path="height" type="int | str | None" default="None">
  Component height with scrolling if needed
</ParamField>

## Events

- **change** - Triggered when markdown content changes
- **copy** - Triggered when content is copied

## Examples

### With LaTeX

```python
import gradio as gr

md_with_latex = r"""
# Math Equations

Inline math: $E = mc^2$

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

gr.Markdown(value=md_with_latex)

Code highlighting

import gradio as gr

md_code = '''
# Code Examples

Python:
```python
def hello():
    print("Hello!")
JavaScript:
const greet = () => console.log("Hello!");
''' gr.Markdown(value=md_code)

Build docs developers (and LLMs) love