Markdown syntax support

Basic syntax

Emphasis

Italic, bold, bold italic, ~~strikethrough~~, and inline code.

Links

Internal: Welcome to Serene. External: Astro.

Lists

Unordered:

One
Two
- Nested
Three

Ordered:

Open an article
Press ⌘K to search
Toggle the theme

Blockquote

Gunshot, thunder, sword rise. A scene of flowers and blood.

A quiet page can still carry a loud idea.

Blockquotes can contain emphasis, links, and inline code.

Callouts

Use a blockquote marker to add a structured note. Labels are case-insensitive, and [!tips] maps to the tip style. Add a title after the marker when the default label is not enough.

Add - to start closed, or + to start open. Both forms use native details controls, so their state works without client-side scripts:

Check this before publishing

This content stays quiet until the reader chooses to open it.

This note starts open

Custom titles preserve inline Markdown, including code and emphasis.

Horizontal rule

Code

Short blocks stay expanded:

const theme = 'serene'
console.log(`hello, ${theme}`)

Longer blocks get a collapse control in the theme UI:

// Sample multi-line snippet for collapse testing
export type NavItem = { label: string; href: string }

export function isActive(pathname: string, href: string): boolean {
  if (href === '/') return pathname === '/'
  return pathname === href || pathname.startsWith(`${href}/`)
}

export function formatTitle(
  pageTitle: string | undefined,
  siteTitle: string,
  delimiter: string
): string {
  if (!pageTitle) return siteTitle
  return `${pageTitle} ${delimiter} ${siteTitle}`
}

// padding lines so the block is long enough to collapse
const lines = Array.from({ length: 12 }, (_, i) => `line-${i + 1}`)
console.log(lines.join('\n'))

Tables

Feature	Notes
Dark mode	`data-theme` on `<html>`
Search	Pagefind after build
Comments	Opt-in Waline

Keyboard and marks

Use Ctrl + K (or ⌘K) for search. Highlighted text uses the theme mark style when available.

Images

Local assets via relative path:

Soft blue horizon

Click the image to zoom (unless marked data-no-zoom on heroes).