willnorris.com
don’t lose focus

Page Style

Headings (This is h2)

Heading 3

Heading 4

Heading 5
Heading 6

Content

This is a paragraph of text. It contains multiple sentences and on most screen widths will span across multiple lines. This helps visualize the spacing between adjacent paragraphs.

This paragraph has an inline link that goes nowhere. Text can be formatted in various ways including bold, strong, italics, emphasis, and strikethrough. It can also be small, subscript and superscript.

Block quotes have special formatting.

This paragraph has a red border and padding applied by Tailwind CSS.

Images with text

This paragraph has an outset floating image to the left of the text. The left side of the image extends into the empty margin of the page, and text that exceeds the height of the image should wrap around to the next line.

This paragraph has a floating image to the right of the text. The right side of the image should align with the page content width, and text that exceeds the height of the image should wrap around to the next line.

Lists and Tables

  • unordered list item 1
  • unordered list item 2
    • sub list item
      • sub list item
        • sub list item
  1. ordered list item 1
  2. ordered list item 2
    1. sub list item
      1. sub list item
        1. sub list item
definition list term 1
definition
definition list term 2
definition
table heading 1 table heading 2
data cell 1 data cell 2
data cell 3 data cell 4

Colors

this uses the CSS variable --color-red this uses the CSS variable --color-red
this uses the CSS variable --color-orange this uses the CSS variable --color-orange
this uses the CSS variable --color-yellow this uses the CSS variable --color-yellow
this uses the CSS variable --color-green this uses the CSS variable --color-green
this uses the CSS variable --color-blue this uses the CSS variable --color-blue
this uses the CSS variable --color-cyan this uses the CSS variable --color-cyan
this uses the CSS variable --color-purple this uses the CSS variable --color-purple
this uses the CSS variable --color-grey-20 this uses the CSS variable --color-grey-20
this uses the CSS variable --color-grey-30 this uses the CSS variable --color-grey-30
this uses the CSS variable --color-grey-60 this uses the CSS variable --color-grey-60
this uses the CSS variable --color-grey-80 this uses the CSS variable --color-grey-80
this uses the CSS variable --color-grey-90 this uses the CSS variable --color-grey-90
this uses the CSS variable --color-white this uses the CSS variable --color-white

Code and pre-formatted text.

Content with some code inline.

preformatted text with four space indentation

// go code sample inside a code fence (three backticks)
package sample

import "fmt"

func main() {
    var s string
    n := 123
    fmt.Println("this is sample go code")
}

Code sample with line numbers and highlighting:

199<!doctype html>
200<!-- html code sample -->
201<html>
202  <head>
203    <link rel="stylesheet" href="/style.css" />
204  </head>
205  <body>
206    <h1>Heading</h1>
207  </body>
208</html>