[email protected] ~ $

Typography

A quick reference for prose styles. The page title above is the template h1; everything below is rendered from markdown inside .content.

Headings

Heading 3

Heading 4

Heading 5
Heading 6

Paragraphs

This is a regular paragraph. Latin Modern Roman at 1rem with relaxed line height — the sort of text you’d read in a long-form article or technical note.

This is a second paragraph. It should have comfortable spacing from the one above, without an exaggerated gap.

Inline text

Bold text, italic text, and bold italic. You can also use inline code, Ctrl + S, strikethrough, inserted text, highlighted text, and H2O / E = mc2.

A word with an HTML abbreviation. Here’s some small print for captions or disclaimers.

Blockquotes

A simple blockquote. It should have a left border, muted color, and italic styling.

Blockquotes can span multiple paragraphs when needed.

Nested quotes work too.

This is a quote inside a quote.

Don’t communicate by sharing memory, share memory by communicating. — Rob Pike

Code

Inline: const greeting = "hello, world";

package main

import "fmt"

func main() {
    fmt.Println("Hello, typography!")
}
<article class="content">
  <h1>{{ .Title }}</h1>
  {{ .Content }}
</article>

Lists

Unordered:

  • First item
  • Second item
    • Nested item
    • Another nested item
  • Third item

Ordered:

  1. First step
  2. Second step
    1. Sub-step A
    2. Sub-step B
  3. Third step

Definition list:

Term
Definition for the term above.
Another term
A second definition with a bit more text to show wrapping behavior.

Horizontal rule

Above the rule.


Below the rule.

Table

NameRoleStatus
AliceEngineerActive
BobDesignerAway
CarolResearcherActive

A regular link and an external link for comparison.

Footnotes

Here’s a sentence with a footnote.1


  1. Footnotes render in a separate section at the bottom of the article. ↩︎