Component

Markdown Renderer

Renders markdown content as styled HTML with prose typography. Uses the headless @refraction-ui/markdown-renderer core.

Examples

Rendered markdown with headings, lists, and code blocks.

Hello World

This is a markdown renderer with italic and inline code.

Features

Headings
Lists
Code blocks
Bold and italic text

const greeting = "Hello!"
console.log(greeting)

Installation

$pnpm add @refraction-ui/react-markdown-renderer

Usage

tsx

import { MarkdownRenderer } from '@refraction-ui/react-markdown-renderer'
export function MyComponent() {
  return <MarkdownRenderer content="# Hello **World**" />
}

Props

Prop	Type	Default	Description
`content`	`string`	--	Markdown string to render.
`className`	`string`	--	Additional CSS classes.