MDX Basics

MDX lets you use React components inside Markdown. Write standard Markdown, then add components wherever you need interactive or styled content.

Markdown Syntax

All standard Markdown syntax works: headings, lists, links, images, code blocks, tables, and blockquotes.

Text Formatting

Code Blocks

Use fenced code blocks with a language identifier for syntax highlighting:

```tsx
function Hello() {
  return <div>Hello World</div>;
}
```

Using Components

Import and use React components directly in your MDX files:

<Callout type="info" title="Note">
  This is an informational callout.
</Callout>

Available Components