Heading level one#

This post is a living rendering check for every Markdown feature supported by the site. It starts with all six heading levels, including the automatic permalink that appears when a heading is hovered or focused.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non vestibulum massa. Cras eleifend ipsum in massa hendrerit tristique. Proin venenatis vehicula metus, at maximus massa blandit sed. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum quis blandit dolor. In sit amet diam et est aliquam porttitor ac aliquet lacus. Nam vulputate, dolor vel facilisis vestibulum, quam quam bibendum tellus, id vehicula augue ex vel urna. Sed hendrerit ornare sapien, in ultricies sem scelerisque ut. Ut ullamcorper nibh nisi, molestie tristique magna luctus id. Pellentesque iaculis dictum mauris, nec suscipit ligula consectetur eget.

Curabitur nec sapien nec tortor dignissim euismod et id enim. Sed dignissim neque quam, non blandit neque fermentum quis. Nulla dui arcu, cursus non nibh eu, facilisis accumsan lacus. Integer leo ante, mattis eget pharetra ut, fermentum et tortor. Curabitur efficitur porta dui non ultricies. Nunc consequat mollis urna a malesuada. Etiam facilisis vitae erat eget tristique. Mauris venenatis risus felis, a pharetra velit imperdiet id. Sed in ligula ut augue lacinia sollicitudin. Ut posuere laoreet nisi, eu varius sem semper sit amet. Nulla risus metus, gravida sit amet neque a, faucibus congue est. Pellentesque tincidunt lacus ut ornare rhoncus.

Curabitur condimentum felis sit amet augue ultricies facilisis. Fusce in suscipit ex, non semper purus. Nullam mollis lobortis condimentum. In tempus eu quam sed pellentesque. Vivamus scelerisque tincidunt turpis, in euismod magna congue non. Vestibulum dui tortor, facilisis bibendum erat rhoncus, aliquam auctor turpis. Maecenas tempus, augue id tristique aliquam, dolor justo bibendum turpis, id pulvinar purus tellus id est. Phasellus a iaculis lorem, a iaculis felis. Mauris a libero lorem. Proin nibh massa, porta sit amet volutpat et, sagittis varius libero.

Heading level two#

Heading level three#

Heading level four#

Heading level five#

Heading level six#

Paragraphs and text formatting#

This is a regular paragraph with bold text, italic text, bold italic text, ~~strikethrough~~, and inline code. Markdown characters can be escaped, so these asterisks and #this hash stay literal.

This sentence ends with a single newline.
Thanks to hard-break support, this sentence begins on a new line.

Raw HTML adds highlighting, underlining, H₂O, x², an ARIA abbreviation, and the keyboard shortcut ⌘ + K.

Links#

Here is an internal link to the Random notes, an external link to the CommonMark specification, and an email link. A bare URL is linked automatically: https://github.com/remarkjs/react-markdown.

Angle brackets also create autolinks for https://www.markdownguide.org/ and hello@example.com.

Lists#

An unordered list can contain nested list types:

First unordered item
Second unordered item
- A nested unordered item
- Another nested item
  1. A nested ordered item
  2. A second ordered item
Third unordered item

An ordered list can start from a number other than one:

Third place
Fourth place
Fifth place

A task list shows both states:

Demonstrate a completed task
Demonstrate an incomplete task

Blockquotes#

Good writing makes complicated ideas feel inevitable.

A blockquote can contain more than one paragraph.

It can also contain a nested blockquote.

Images and figures#

A local image with alternative text and a title:

A remote image:

A remote placeholder image

Raw HTML supports a figure with a caption:

A caption attached to an image using raw HTML.

Horizontal rule#

The thematic break below separates two ideas.

And this paragraph begins after the rule.

Code#

An unlabelled fenced block preserves preformatted text:

No syntax highlighting is applied here.
Whitespace    stays    intact.

A language-labelled block gets syntax highlighting:

function greet(name) {
  const message = `Hello, ${name}!`;
  return message;
}

console.log(greet("world"));

Tables#

GitHub-style tables support left, centre, and right column alignment:

Left aligned	Centre aligned	Right aligned
Alpha	12	$1.20
Beta	345	$34.50
Gamma	6	$0.60

Mathematics#

Inline mathematics fits inside a sentence: $E = mc^2$ .

Display mathematics gets its own scrollable block:

\sum_{i=1}^{n} i = \frac{n(n+1)}{2}

Footnotes#

This statement has a short source note.¹ Another statement uses a longer, named footnote.²

Disclosure and definition lists#

Open this disclosure widget

The hidden panel can contain formatted HTML and normal text.

Markdown: A lightweight plain-text markup language.
Renderer: The component that turns this source into accessible HTML.

Embedded and native media#

Image syntax turns a YouTube URL into a responsive video embed:

It also recognises Vimeo URLs:

A direct video URL becomes a native video player:

A direct audio URL becomes a native audio player:

Raw HTML can provide media controls and custom attributes:

Raw HTML safety#

Raw HTML can add a small semantic wrapper:

A concise footnote rendered at the end of the article. ↩
Footnotes can contain formatting, links, and additional indented text. ↩