utf9k

Something to think about: Did you know solo camping is a thing? I should try it sometime.

Typography

This page contains various markdown blocks for testing typographic rendering

Contents

This page is used to test out colour schemes of various elements

Paragraphs #

Any line of text with a space above and below becomes a paragraph.

These two lines don’t have a space so they are merged together.

These two lines are not merged together
because they contain an explicit line break.

This is a large amount of text that will render as a paragraph and despite what you might imagine will happen, there will be no magical line breaks or anything else that will save you from this extremely long run-off sentence so your only hope is that I will run out of text to type.

Headings #

This is an H1 #

This is an H2 #

This is an H3 #

This is an H4 #

This is an H5 #
This is an H6 #

Typography #

This is a paragraph with some regular text.

This is a paragraph
with a forced line break.

Markdown Tags #

This is a paragraph with some bold text.

This is a paragraph with some italic text.

This is a paragraph with some bold and italic text.

This is a paragraph with some strikethrough text.

This is a paragraph with some italic strikethrough text.

This is a paragraph with some bold strikethrough text.

This is a pagagraph with some inline code text.

HTML Tags #

This is a paragraph with some subscript text.

This is a paragraph with some superscript text.

This is a paragraph with some underlined text.

This is a paragraph with some strikethrough text.

This is a paragraph with some deleted text.

This is a paragraph telling you to press CTRL + ALT + DELETE.

This is a paragraph with some marked text.

This is a paragraph with some inline code text.

Line Breaks #

Here is a Markdown line break


Here is an HTML line break


Blockquotes #

This is regular text.

This is a regular blockquote.

This is also regular text.

This is something that someone might have once said

— Some Person

Someone once said

This is a nested blockquote

and everyone present gasped

This is an HTML blockquote

— Some Person

Code Blocks #

Tip

A list of valid language identifiers can be found here.

Here is some JSON that is indented with two spaces:

{
  "nice": true
}

Here is a bash script:

#!/usr/bin/env bash
echo "something"

Here is some Python that is intended with 4 spaces:

with open("file.txt", "w") as file:
    if something:
        file.write(data)

Code Blocks with Shiki Notation #

Here are some extensions provided by Shiki

Diffing #

function blah(name) {
  console.log("Hello") 
  console.log(`Hello ${name}`) 
}

Line Highlighting #

function blah(name) {
  console.log(`Hello ${name}`) 
}

Focus #

function blah(name) {
  console.log(`Hello ${name}`) 
}

Error levels #

function blah(name) {
  console.warn("Hello") 
  console.error("Goodbye") 
}

Line Highlighting - Native #

function blah(name) {
  console.warn("Hello")
  console.error("Goodbye")
}

Word Highlighting - Native #

function blah(name) {
  console.warn("Hello World!")
}

This is a paragraph containing a link using Markdown syntax.

This is a paragraph containing a link using HTML syntax.

Images #

This is an image rendered using Markdown syntax:

Image by Robert Clark on Unsplash

This is an image rendered using Markdown syntax, with a title:

Image by Robert Clark on Unsplash
This is an interesting image

This is an image rendered using HTML syntax:

Image by Robert Clark on Unsplash

This is an image rendered using HTML syntax, and a trailing figcaption:

Image by Robert Clark on Unsplash
You can see the source image here

Embedded Media #

Video #

Audio #

iFrames #

Lists #

This is an unordered list:

This is an ordered list:

  1. Item 1
  2. Item 2
  3. Item 3

This is a nested list:

This is a task list:

This is a definition list:

Loch Ness Monster
A large, mythical water creature.
Internet
A place for storing junk information

Footnotes #

Here is a some text with a footnote containing more information.1

Comments #

You are able to see this

Escaping #

Using a backslash means that *this text* is not bolded.

Tables #

Name Notes Setting
Blah Neat Yes
Bleh Rude No

Callouts (Github Syntax) #

Note

Useful information that users should know, even when skimming content.

Tip

Helpful advice for doing things better or more easily.

Important

Key information users need to know to achieve their goal.

Warning

Urgent info that needs immediate user attention to avoid problems.

Caution

Advises about risks or negative outcomes of certain actions.

Caution

Here is a multi-line alert

  • It can contain a list
  • With many items
    • Even subitems
    • and tasks

Redactions #

This heading contains some ████████ text

This sentence contains █████████████████ text that is hidden. It should ███ be ████████████████ readable.

██████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████ ██████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████

  1. Here is some more information. ↩︎