A tool to convert Markdown files into React components.

A tool to convert Markdown files into React components. Try it yourself with the MDXC Playground.

MDX is a simpler way to write content for you React applications. While standard Markdown compiles to a string of HTML, MDX compiles directly to JavaScript. If you're writing a React app, MDX is both easier to use and more flexible than standard Markdown.

Writing with MDX let's you use the full power of React, even when writing content.

• You can import and use custom components within your content
• You can replace Markdown's default elements with your own, allowing you to add custom behavior to links, headings, etc.
• You can nest Markdown-formatted content within JSX elements

Try it yourself

The easiest way to try MDX is to edit the source on the left of this page!

Otherwise, you can try the old fashioned way:

# Install the `mdxc` command line tool using npm
npm install -g mdxc

# Create a file with a single heading
echo '# Hello, World' > example.mdx

# Output the compiled component to your console
mdxc example.mdx

Other ways to use MDX include:

• Use it with Sitepack to build static websites
• Use it with Webpack
• Use the API directly

For details, jump to the usage section