A
Aether UI

MarkdownRenderer

Renders a markdown string as styled HTML — headings, lists, bold, italic, inline code and more.

Hello world

This is bold and italic text.

  • Item one
  • Item two

inline code

import { MarkdownRenderer } from "@aetherstack/ui"

Installation

terminal
npx aether-ui add markdown-renderer

Import

import.tsx
import { MarkdownRenderer } from "@aetherstack/ui"

Usage

markdownrenderer.tsx
const response = `## Result

Here is the answer with **formatting** support.

1. Step one
2. Step two

\`code snippet\`
`

<MarkdownRenderer content={response} />

Props

PropTypeDefaultDescription
content*string—Markdown string to render.
classNamestring—Additional CSS classes.

* Required

Accessibility

  • →Rendered output uses semantic HTML elements (h2, ul, strong, etc.) for correct screen reader navigation.
  • →Code blocks inside the rendered output include a visually-hidden language label for assistive technology.