Skip to content
IntelliHelper logo

Intelli UI

ContentLiquid Glass

Markdown Editor

Rich-text and markdown editing with split preview. Preview live, copy the source, or install with the CLI into your Next.js project.
npx @intellihelper/cli@latest add markdown-editor

Editor with preview

About this component

Markdown Editor is part of Content. Rich-text and markdown editing with split preview.

Install with npx @intellihelper/cli@latest add markdown-editor. Files land in your project so you can customize styles, variants, and behavior without a locked package.

Prefer AI-assisted install? Use the agent plugin or the MCP server.

When to use Markdown Editor

Use when

  • Use Markdown Editor when rich-text and markdown editing with split preview.
  • Typography, markdown, code viewers, and documentation surfaces.
  • Long-form help, changelogs, or in-app guides.

Avoid when

  • Dense data tables (use data components).
  • Primary navigation (use navigation components).

Accessibility notes

  • Preserve heading hierarchy in markdown rendering.
  • Code blocks should not trap focus; copy actions need labels.

Interactive primitives build on accessible patterns (including Radix where applicable). Always verify focus order and contrast on your mesh or product background.

Composition tips

  • Keep content panels readable: higher opacity and stronger text contrast than pure chrome.
  • Separate chrome toolbars from the reading column.

FAQ

View all content