Style Guide

A kitchen sink — every element below is plain Markdown in content/projects/styleguide.md, rendered through the same .md styles the whole site shares. There is no per-page CSS.

This first paragraph is automatically treated as a muted "lede". Normal body text follows, and inside it you can mix bold, italic, strikethrough and inline code. Links look like an internal link or an external one — external links open in a new tab.

Headings

# is the project title (shown in the header above). ## is a section, and below that:

Heading level three

Heading level four

Lists

Unordered, with nesting:

  • A point
  • Another point
    • A sub-point
    • One more
  • Back at the top level

Ordered:

  1. First
  2. Second
  3. Third

A task list (GitHub-flavored Markdown):

  • Something done
  • Something still open

Quote

Blockquotes are good for a citation, or a single idea you want to set apart.

Admonitions

Callouts use GitHub alert syntax — a blockquote whose first line is [!NOTE], [!TIP], [!IMPORTANT], [!WARNING], or [!CAUTION]:

NOTE

Useful context the reader should know, but can skim past.

TIP

A helpful shortcut or a nicer way to do the same thing.

IMPORTANT

Information that's essential to getting the result you expect.

WARNING

Something that needs attention to avoid a problem.

CAUTION

The risky path — possible data loss or other irreversible effects.

Code

Inline like npm run dev, or a fenced block:

function greet(name: string) {
  return `Hello, ${name}`;
}

Table

SyntaxLooks like
**bold**bold
*italic*italic
[label](url)label

Divider

Three dashes make a horizontal rule:


Image

Globe

Images render responsively — drop a file into public/ and reference it as /your-image.png.


That's the full range. Copy anything here into your own project files.