Markdown is a shorthand syntax for writing highly stylized text. It can be a great tool when you are taking notes, documenting code, or even writing a site like this one.
Below you will find a cheat sheat of all the different types of markdown text available for most markdown flavors, as well as some extensions utilized in this site.
Headers/Titling
To do headers and subtitles, use a #
. One #
is the largest, and adding another #
continues to make the text smaller.
## H2 Header
### H3 Header
#### H4 Header
H2 Header
H3 Header
H4 Header
Text Styling
*Italicized text has its text surrounded by single stars*
**Bold text has its text surrounded by double stars**
Italicized text has its text surrounded by single stars
Bold text has its text surrounded by double stars
Bullets And Numbers
* One bullet
* indented bullets have two spaces from its parent
* second bullet
1. Numbering can be done as well
2. Just by using numers
3. Which will indent the numbers
- One bullet
- indented bullets have two spaces from its parent
- second bullet
- Numbering can be done as well
- Just by using numers
- Which will indent the numbers
Block Quotes
> Block quotes just use a single caret to create an indented paragraph.
Block quotes just use a single caret to create an indented paragraph.
Coding
`SomeClass` - uses back ticks around classes and functions to indicate this is the exact name in code.
```kotlin
// Code comments
val foo = "bar"
println(foo)
```
Below are some sample styles for markdown code highlighting to be placed after the first three backticks.
- kotlin
- json
- bash
- java
- javascript
SomeClass
- uses back ticks around classes and functions to indicate this is the exact name in code.
// Code comments
val foo = "bar"
println(foo)
Hyperlinking
If you want to create blue text that hyperlinks to a website like Google, Surround the text to be shown in blue around brackets, and parantheses around the actual website link just like: [Google](www.google.com)
Images
Images supported in markdown are png, jpg, and gif’s.
![Sample Screenshot description](/assets/images/sample.gif)
![The description that displays to the user when hovered over](relative path to image)
Tables
| 1 | 2 | 3 |
|---|---|---|
| Fizz | Buzz | fizz |
| fiz | buzz | buzz |
1 | 2 | 3 |
---|---|---|
Fizz | Buzz | fizz |
fiz | buzz | buzz |
Jekyll Text Theme Markdown Enhancements
Material Mkdocs Markdown
This site is generated by Jekyll Text Theme which has a little extra flavor of markdown to add even more styles that are missing in markdown.