Docs › Writing helpers

Markdown

Type Markdown, paste Markdown, and read or load content as Markdown.

Type # , - or **bold** and the formatting appears as you write. You can also paste Markdown, or read and load the whole content as Markdown.

Try it

Code for this demo

createEditor('#editor', {
  toolbar: 'heading | bold italic strike code | bulletList orderedList checklist | blockquote codeBlock | markdown',
  height: 320,
});

Rules while typing

At the start of a paragraph, these marks followed by a space change the block. Code blocks and rules change when you press Enter on that line.

Type	Result
`#` to `####`	Heading 1-4
`-` `*` `+`	Bulleted list
`1.` or `1)`	Numbered list
`[]` `[ ]` / `[x]`	Checklist (x starts checked)
`>`	Quote
``` + `Enter`, ```js + `Enter`	Code block (with a language)
`---` `***` `___` + `Enter`	Horizontal rule

Inside text, the change happens when you type the closing mark.

Type	Result
`x` or `__x__`	Bold (`<strong>`)
`x` or `_x_`	Italic (`<em>`)
`~~x~~`	Strikethrough (`<s>`)
`x`	Inline code (`<code>`)

Pasting Markdown

Plain text that reads as Markdown (from a text editor, VS Code or a chat app) is pasted as formatting. Headings, code fences, tables, two or more list items, links and bold marks count. A message says so, and its Paste as text button puts the original text back instead.

Not inside a code block, not with Ctrl+Shift+V, not with pasteMode: 'plain'.
Clipboards that carry HTML (web pages, Word) follow Paste cleanup instead.
The paste event arrives with source: 'markdown'.

The markdown button opens the content as Markdown. Copy it, or edit and apply to replace the content (undoable). In the board and full presets it sits in the ⋯ more menu.

From code

// the content as Markdown
const md = editor.getMarkdown();

// replace the content with Markdown (undoable)
editor.setMarkdown('# Notice\n\n**Maintenance** tomorrow.');

// convert without an editor
import { markdownToHtml, htmlToMarkdown } from '@82editor/core';
const html = markdownToHtml('- one\n- two');
const back = htmlToMarkdown(html);

Covered: headings, lists (nested and tasks), quotes, code fences, tables, rules, bold, italic, strikethrough, code, links and images. What Markdown cannot say (colors, callouts, folds, videos, photo groups, attachments, tables with merged cells) stays as HTML inside the Markdown, and markdownToHtml reads it back. A single newline becomes <br>.

htmlToMarkdown uses the browser document; on a server you need a DOM. HTML from markdownToHtml is sanitized again when it goes into the editor.

Options

Name	Type	Default	Description
`markdownShortcuts`	boolean	`true`	Markdown rules while typing. `false` turns off block and inline rules.
`markdownPaste`	boolean	`true`	Paste plain text that reads as Markdown as formatting.
`markdown`	toolbar item	—	View and edit as Markdown
`getMarkdown()`	method	—	The content as a Markdown string
`setMarkdown(md)`	method	—	Replace the content with Markdown

Try Markdown

Rules while typing

Pasting Markdown

Markdown window (markdown toolbar item)

From code

Options