Three React packages that share one Markdown model, so an app can grow from displaying Markdown to authoring and personalizing it without changing how anything is stored.
npm i @react-markdown-kit/rendererNo provider, no stylesheet, no configuration, no design system. Edit the Markdown on the left and watch the output follow, or open the renderer demo to try every option and copy the code.
import Markdown from '@react-markdown-kit/renderer'
<Markdown>{content}</Markdown>
Ships today. See the changelog.
compileMarkdown is now public| Metric | Before | After |
|---|---|---|
| Cold render | 12.4 ms | 9.1 ms |
Switch customer. The output changes and the authored source does not. That is the whole idea: it stays Markdown at every step.
# Account review for {{customer.name}}
Your plan renews on {{renewsAt | date:"medium"}}.
| Item | Amount |
| --- | ---: |
| Subscription | {{amounts.subscription \| currency:"USD"}} |
| Overage | {{amounts.overage \| currency:"USD"}} |
Your plan renews on Nov 1, 2026.
| Item | Amount |
|---|---|
| Subscription | $4,800.00 |
| Overage | $312.50 |
template()
{
"customer": {
"name": "Acme Industrial"
},
"renewsAt": "2026-11-01",
"amounts": {
"subscription": 4800,
"overage": 312.5
}
}The renderer never requires the editor. Templates and Mermaid diagrams install separately and are used only through the extension system.
Markdown to React. Safe by default, unstyled by default, server-ready. Matches react-markdown on every compared prop.
Read moreRich, source and preview authoring that reads and writes plain Markdown. Opening and closing a document does not change a byte of it.
Read more · Demotemplate({ data }) resolves typed variables while the renderer parses; templateVariables() edits them as chips. A plugin package: no engine to call, and no React needed to resolve.
mermaid() turns a ```mermaid flowchart into static SVG in the renderer and a drawing canvas in the editor. A plugin package with one export.
We do not claim “drop-in replacement” or “fastest”. Every number here has a test behind it.