---
title: "Formatting tour: math, diagrams, code, tables"
url: https://mdfy.app/F1q9U1YP
updated: 2026-05-14T17:52:48.410Z
source: "mdfy.app"
---
# Formatting tour: math, diagrams, code, tables

A reference for what renders in mdfy. Every block below appears in real docs across this hub.

## KaTeX math

Inline: $E = mc^2$. Display:

$$
\int_0^{\infty} e^{-x^2}\, dx = \frac{\sqrt{\pi}}{2}
$$

Matrix:

$$
\begin{pmatrix} a & b \\ c & d \end{pmatrix} \begin{pmatrix} x \\ y \end{pmatrix} = \begin{pmatrix} ax + by \\ cx + dy \end{pmatrix}
$$

## Mermaid diagrams

```mermaid
flowchart LR
  Doc[(Doc)] --> Bundle((Bundle))
  Bundle --> Hub[/Hub/]
  Hub --> AI[Any AI]
  AI -. cites .-> Doc
```

```mermaid
sequenceDiagram
  participant U as You
  participant M as mdfy
  participant AI as Claude/ChatGPT
  U->>M: Publish doc
  M-->>U: Permanent URL
  U->>AI: Paste URL
  AI->>M: Fetch /raw/<id>
  M-->>AI: Clean markdown + graph
```

## Code with highlighting

```typescript
const res = await fetch("https://mdfy.app/api/hub/demo/recall", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ question: "react hooks", k: 5, rerank: true }),
});
const { results } = await res.json();
```

```python
import requests

r = requests.post("https://mdfy.app/api/docs",
  json={"markdown": "# Hello World"})
print(r.json()["url"])  # → "https://mdfy.app/abc123"
```

## Tables

| Scope | URL | Cost |
|:------|:----|:-----|
| Doc | `mdfy.app/<id>` | tightest |
| Bundle | `mdfy.app/b/<id>` | mid (+graph) |
| Hub | `mdfy.app/hub/<slug>` | broad |

That's the rendering vocabulary mdfy expects to handle on any doc.