react-markdown: Markdown component for React
Render markdown as React components via unified.
Learn more about React Markdown
react-markdown is a React library that converts markdown text into React virtual DOM elements. It builds on the unified, remark, and rehype toolchain to parse markdown into an abstract syntax tree, transform it through plugins, and render it as React components. The library supports CommonMark compliance and GitHub Flavored Markdown through optional plugins, and allows developers to replace standard HTML elements with custom React components. It avoids dangerouslySetInnerHTML by constructing a virtual DOM directly from the syntax tree, enabling React's standard reconciliation and update mechanisms.
Virtual DOM Rendering
Constructs React elements directly from the markdown AST instead of using dangerouslySetInnerHTML. Enables React's standard reconciliation, diffing, and update mechanisms for safer, more performant rendering.
Component Substitution System
Replace any generated HTML element with custom React components through a simple mapping. Enables syntax highlighting, design system integration, and custom behaviors without wrapper divs or DOM manipulation.
Unified Plugin Ecosystem
Built on the unified.js ecosystem, enabling transformation pipelines with remark and rehype plugins. Add syntax highlighting, math rendering, or custom transformations by composing existing plugins or writing custom processors.
import ReactMarkdown from 'react-markdown';
const markdown = '# Hello World\n\nThis is **bold** text.';
export default function App() {
return <ReactMarkdown>{markdown}</ReactMarkdown>;
}Adds fallback prop to MarkdownHooks and fixes race condition issue.
- –Add `fallback` prop to `MarkdownHooks`
- –Fix race condition in `MarkdownHooks`
Fixes TypeScript performance issues related to component type checking.
- –Fix TypeScript performance around components
Breaking change removes support for className prop.
- –Remove support for `className` prop
Top in Frontend
Related Repositories
Discover similar tools and frameworks used by developers
React Beautiful DnD
Accessible React library for list drag-and-drop interactions.
daisyUI
Semantic component classes extending Tailwind CSS utilities.
shadcn/ui
Copy-paste React components built on Radix and Tailwind.
Tachiyomi Website
Official website for Tachiyomi manga reader with documentation and guides.
TanStack Form
Type-safe headless form state management across frameworks.