A lengthy Markdown guide that covers a lot of features, best viewed as a website
Important notice: many of these aren't going to work with all flavours1
Table of Contents
| Type | Syntax | Render |
|---|---|---|
| Bold/Strong Text | **bold** |
bold |
| Italic/Emphasised Text | *italic* |
italic |
| Superscript | 12^2^ |
12^2^ |
| Emotes | :flushed: |
😳 |
| Keyboard Buttons | <kbd>CTRL</kbd> + <kbd>Z</kbd> |
CTRL + Z |
| Highlight | ==Mark== |
==Mark== |
| Subscript | H~2~O |
H |
| Escape Characters | \*escaping\* and | pipes |
*escaping* and | pipes |
| Strikethroughed Text | ~~strikethrough~~ |
Put <hr>, *** or ---.
Put <br> or end a line with two spaces.
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
> This is how you make a blockquote
This is how you make a blockquote
> You
>> Can
>>> Also nest them
>>>> Space after > is good practice
>>>> Add **text modifications**
> - Even lists
> - Listception with the correct indention
You
Can
Also nest them
Space after > is good practice Add text modifications
- Even lists
- Listception with the correct indention
| Left-Aligned | Centered | Right-Aligned |
|:-------------|:----------:|--------------:|
| It all | depends on | the colons |
Put <br> where you want the line break.
| Type | Syntax | Render |
|---|---|---|
| Multiline table | Fancy<br>pants<br>table |
Fancy pants table |
`Encase something in backticks`
Encase something in backticks
```language {.custom-property-1, custom-property-2} // Code ```
blockquote {
background-color: rgba(227, 91, 21, 0.1) !important;
color: var(--text, #e4cbb3) !important;
font-style: italic !important;
border-left: 3.5px solid var(--ui, #e35b15) !important;
}[text](link "onhover")
This is a [Useful site](https://www.markdownguide.org/basic-syntax/ "Markdown cheatsheet").
This is a Useful site.
<fake@example.mail> fake@example.mail
[text][1]
[1]: (link) "onhover"
[Markdown][1] is very useful.
[1]: (https://en.wikipedia.org/wiki/Markdown) "Markdown Language"
Markdown is very useful.
Makes an image act as a link to something when you click on it.2
[](link.onclick)
if you guys have a kitteh pls send a pic cuz not sure if this is gpl
- This is an unordered list that uses -
- You can't mix * with -
- Nest them
- > Blockquotes
- [x] Even checklists can be nested
- [ ] Unmarked ones as well
- - Weird nesting with two -
+ You can also use +
* This is also an unordered list but it uses *
- And also nest them with either * or -
* - - Putting multiple * gives weird results
-
This is an unordered list that uses
- -
You can't mix
*with-- Nest them
-
Blockquotes
- Even checklists can be nested
- Unmarked ones as well
-
- Weird nesting with two
-
- Weird nesting with two
-
You can also use
+ -
This is also an unordered list but it uses
*- And also nest them with either
*or-
- And also nest them with either
-
-
- Putting multiple
*gives weird results
- Putting multiple
-
- Ordered list with 1.
- Now it's with 2.
- You can also use 1) but it gets rendered as 1.
- [ ] Task to do
- [x] Finished task
* [x] ~~Crossed out with *~~
- Task to do
- Finished task
-
Crossed out with *
Text
: Definition
Markdown : A very nice language for writing documents in.
LaTeX : An advanced markup language. : Difficult to read.
## Custom Heading id {#custom-id}
## Custom Heading class {.custom-class}
[\\]: # "comment"
Click to Expand!
<details>
<summary>Click to Expand!</summary>
content
<\details>
Some markdown editors support automatic Table of Contents generation or a tag like [TOC]. You can make one by hand if you link to the heading id (usually is the same as the heading itself) in a list.
## Table of Contents -> #table-of-contents
- [text](#id)
- [Table of Contents](#table-of-contents)
- [MermaidJS](#mermaidjscharts)
Shows meaning on hover.
*[Abbreviation]: Meaning
*[Abbreviation]: Meaning
Abbreviation is a great word.
If you're converting your Markdown into something like LaTeX, you might want to put some metadata like author, date, title, theme and others.
---
title: Noob to Pro Markdown Guide
author: Kyle
---Fancy JavaScript to make all kinds of charts.3
graph TD
A[Try Word] -->|Realize it's bad| B(Try Learning LaTeX)
B --> C{Realize it's suffering}
C -->|Option One| D[Learn Markdown]
C -->|Option Two| E[Learn org-mode]
C -->|Option Three| F[Learn Groff]
pie
title Most used Markup languages
"HTML" : 42.96
"Markup" : 50.05
"LaTeX" : 10.01
```mermaid graph TD A[Try Word] -->|Realize it's bad| B(Try Learning LaTeX) B --> C{Realize it's suffering} C -->|Option One| D[Learn Markdown] C -->|Option Two| E[Learn org-mode] C -->|Option Three| F[Learn Groff] ```
```mermaid pie title Most used Markup languages "HTML" : 42.96 "Markup" : 50.05 "LaTeX" : 10.01 ```
Fancy JavaScript allows you to render LaTeX with Markdown if you encase it in $. Single $ is inline, double $$ is a block.
$$\alpha = \beta \rightarrow + Very_{fancy}$$
A simple footnote[^2]. Here is a more elaborate footnote[^large]. And an inline one^[Nifty for short notes]
A simple footnote4. Here is a more elaborate footnote5. And an inline one^[Nifty for short notes]
Footnotes
-
The feature configuration your markdown has, many exist like CommonMark, GitHub Flavoured Markdown, Markdown-it and many others. I use the VSCode/Atom Markdown Preview Enhanced extension and everything in this guide works. ↩
-
Data shown may not be true. ↩
-
The simple footnote. ↩
-
Here is one with several elements. You can even make them very large!
↩Even quotes and other elements if you indent them correctly!