Markdown

🔗 - external link

📄 - PDF / Document 🛠 - Tool

Headers

# This is a heading 1

## This is a heading 2

### This is a heading 3

#### This is a heading 4

##### This is a heading 5

###### This is a heading 6

This is a heading 1

This is a heading 2

This is a heading 3

This is a heading 4

This is a heading 5

This is a heading 6

---

Emphasis

_This text will be italic_
_This will also be italic_

This text will be italic This will also be italic

**This text will be bold**
**This will also be bold**

This text will be bold This will also be bold

_You **can** combine them_

You can combine them

---

Lists

- Item 1
- Item 2
  - Item 2a
  - Item 2b

1. Item 1
1. Item 2
1. Item 3
   1. Item 3a
   1. Item 3b

• Item 1
• Item 2
  • Item 2a
  • Item 2b

1. Item 1
2. Item 2
3. Item 3
   1. Item 3a
   2. Item 3b

---

Images

![Engelbart](https://history-computer.com/ModernComputer/Basis/images/Engelbart.jpg)

Resizing images

Example of this above image resized to 100 pixels wide:

![Engelbart|100](https://history-computer.com/ModernComputer/Basis/images/Engelbart.jpg)

---

Blockquotes

> Human beings face ever more complex and urgent problems, and their effectiveness in dealing with these problems is a matter that is critical to the stability and continued progress of society.

\- Doug Engelbart, 1961

Human beings face ever more complex and urgent problems, and their effectiveness in dealing with these problems is a matter that is critical to the stability and continued progress of society.

- Doug Engelbart, 1961

---

Inline code

Text inside `backticks` on a line will be formatted like code.

Text inside backticks on a line will be formatted like code.

---

Tables

You can create tables by assembling a list of words and dividing them with hyphens - (for the first row), and then separating each column with a pipe |:

| First Header                | Second Header                |
| --------------------------- | ---------------------------- |
| Content from cell 1         | Content from cell 2          |
| Content in the first column | Content in the second column |

First Header	Second Header
Content from cell 1	Content from cell 2
Content in the first column	Content in the second column

---

| Tables can be justified with a colon | Another example with a long title |
| :----------------------------------- | --------------------------------: |
| because of the `:`                   |           these will be justified |

If you put links in tables, they will work, but if you use Piped Links, the pipe must be escaped with a `\` to prevent it being read as a table element.

Tables can be justified with a colon	Another example with a long title
because of the :	these will be justified

If you put links in tables, they will work, but if you use Piped Links, the pipe must be escaped with a \ to prevent it being read as a table element.

| First Header                      | Second Header                   |
| --------------------------------- | ------------------------------- |
| [[Format your notes\|Formatting]] | [[Keyboard shortcuts\|hotkeys]] |

First Header	Second Header
[[Format your notes|Formatting]]	[[Use hotkeys|hotkeys]]

---

Strikethrough

Any word wrapped with two tildes (like ~~this~~) will appear crossed out.

Any word wrapped with two tildes (like this) will appear crossed out.

---

Details

<details>
  <summary>Toggle me!</summary>
  <div>
    <div>This is the detailed content</div>
    <br/>
    <details>
      <summary>
        Nested toggle! Some surprise inside...
      </summary>
      <div>
        😲😲😲😲😲
      </div>
    </details>
  </div>
</details>

Toggle me!

This is the detailed content

Nested toggle! Some surprise inside...

😲😲😲😲😲

MDX

export const Highlight = ({children, color}) => (
  <span
    style={{
      backgroundColor: color,
      borderRadius: '2px',
      color: '#fff',
      padding: '0.2rem',
    }}>
    {children}
  </span>
);

<Highlight color="#25c2a0">Docusaurus green</Highlight> and <Highlight color="#1877F2">Facebook blue</Highlight> are my favorite colors.

I can write **Markdown** alongside my _JSX_!

Docusaurus green and Facebook blue are my favorite colors.

I can write Markdown alongside my JSX!

Adminitions

:::note

Some **content** with _markdown_ `syntax`. Check [this `api`](#).

:::

:::tip

Some **content** with _markdown_ `syntax`. Check [this `api`](#).

:::

:::info

Some **content** with _markdown_ `syntax`. Check [this `api`](#).

:::

:::caution

Some **content** with _markdown_ `syntax`. Check [this `api`](#).

:::

:::danger

Some **content** with _markdown_ `syntax`. Check [this `api`](#).

:::

note

Some content with markdown syntax. Check this api.

tip

Some content with markdown syntax. Check this api.

info

Some content with markdown syntax. Check this api.

caution

Some content with markdown syntax. Check this api.

danger

Some content with markdown syntax. Check this api.

Footnotes

Here's a simple footnote,[^1] and here's a longer one.[^bignote]

[^1]: This is the first footnote.

[^bignote]: Here's one with multiple paragraphs and code.

    Indent paragraphs to include them in the footnote.

    `{ my code }`

    Add as many paragraphs as you like.

Here's a simple footnote,¹ and here's a longer one.^bignote

Emphasis

I need to highlight these <mark>very important words</mark>.

I need to highlight these very important words.

I need to highlight these very important words.

Mermaid Diagrams

```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;

this is the details slider

Details enables markdown?

italics

---

1. This is the first footnote.↩

2. Here's one with multiple paragraphs and code.

   Indent paragraphs to include them in the footnote.

   { my code }

   Add as many paragraphs as you like.↩