Markdown Reference

Every supported element, rendered.

On this page

Text

Regular paragraph text with bold, italic, inline code, a link , an external link and ~~strikethrough~~. Footnotes work too.¹

A blockquote for quoting sources, spanning more than one line to show the spacing.

Lists

First item
Second item
- Nested item
- Another nested item
Third item

Install the dependencies
Run the build
1. Hugo renders the HTML
2. Pagefind indexes it
Deploy public/

Table

Component	Rendered by	Runtime cost
Sidebar	Hugo	none
Table of contents	Hugo	~1 KB observer
Search	Pagefind	loaded on first open
Tabs	Alpine	negligible

Code

javascript

export function initToc() {
  const toc = document.querySelector("[data-toc]");
  if (!toc) return;

  const observer = new IntersectionObserver((entries) => {
    for (const entry of entries) {
      entry.target.dataset.visible = entry.isIntersecting;
    }
  });
}

hugo.toml

[params]
  projectName = "Acme Docs"
  accentColor = "#0ea5e9"

text

No language, no highlighting — still gets a copy button.

Callouts

Try the keyboard

Press ⌘K to search, Esc to close.

Tabs

javascript

const docs = await fetch("/api/docs").then((r) => r.json());

typescript

const docs: Doc[] = await fetch("/api/docs").then((r) => r.json());

Headings

Third level

Content under a third-level heading appears in the table of contents.

Fourth level

Fourth-level headings are styled but excluded from the table of contents.

That horizontal rule marks the end of the sample.

Rendered at the bottom of the page with a link back. ↩︎

Edit this page