Free tool
MDX Playground
Type MDX and watch it render as you go. Pick an example for Docusaurus, Mintlify, or Starlight, or paste your own page. Everything runs in your browser.
Source
Preview
Is your MDX file on GitHub or GitLab? Open it in the same view, edit the text directly, and send the change as a pull request.
Edit an MDX file from GitHubQuestions
- What is MDX?
- MDX is Markdown that can also contain JSX components, like <Tabs>, <Note>, or <Card>. Docs frameworks such as Docusaurus, Mintlify, Starlight, and Nextra use it so writers get Markdown's simplicity plus interactive components.
- Which MDX components does the preview understand?
- The common docs components from Docusaurus, Mintlify, Starlight, Nextra, and Fumadocs: callouts and admonitions (Note, Tip, Warning, Aside, :::tip), Tabs, Steps, Cards, Accordions, and file trees. Components it doesn't know are shown as labelled blocks with their content, so nothing disappears.
- Is my MDX sent anywhere?
- No. The playground parses and renders everything in your browser. Nothing you type is uploaded or stored.
- How do I edit an MDX file that is already on GitHub or GitLab?
- Paste the file's URL into the DraftView editor. It opens the file in the same visual view you see here, lets you edit the text directly or switch to source, and sends your change back as a pull request or merge request. No account is needed until you submit.
Comparing MDX tools? See the best free MDX editors and previewers in 2026.
Next step
Get your MDX reviewed by people who don't read JSX.
DraftView shows a docs pull request as rendered pages like this one. Product managers and experts comment and suggest edits, and every suggestion lands back on the PR. Open any public PR in the demo, no account needed.