Format MDX, the mix of Markdown and JSX used by many documentation sites.
Loading the tool...
How to use MDX Formatter
Paste your code. The formatter engine loads in a moment the first time.
Adjust the options if you need to.
Copy the formatted result.
About MDX Formatter
MDX lets you write JSX components inside Markdown, which documentation frameworks such as Docusaurus and Next.js use heavily. The formatter handles both worlds: the Markdown is tidied and the JSX and import or export statements are formatted like JavaScript.
If a component has a syntax error you get the line and column.
Frequently asked questions
Which MDX version does it support?
It targets the common MDX syntax with imports, exports and JSX blocks. Features specific to the newest MDX releases may be formatted more conservatively.
Will it touch my front matter?
YAML front matter at the top of the file is preserved.
Does it format code blocks?
Fenced code blocks are left untouched.
Why did the first run take a second?
The formatting engine for this language is downloaded the first time you use it, then cached by your browser. After that, formatting is instant and nothing leaves your machine.