Add a number sign/signs (#) before the word to create a header.
| Syntax | Output |
|---|---|
# Heading level 1 |
|
## Heading level 2 |
|
### Heading level 3 |
|
#### Heading level 4 |
|
##### Heading level 5 |
|
###### Heading level 6 |
Three ways create a horizontal rule, use three or more dashes (---), asterisks (***), or underscores (___) on a line by themselves.
- Hyphens (
---) - Asterisk (
***) - Underscores (
___)
OUTPUT:
Same output for three different ways to make horizontal rule
To bold the text, just add two asterisk (*) or underscores (_) before and after the text without space around the letters.
| Syntax | Output |
| :----------------------- | :---------------------- -: |
| **This text** is italic | This text is italic.
| __This text__ is italic. | This text is italic.
To italized the text, just add a asterisk (*) or underscore (_) before and after the text without space around the letters.
| Syntax | Output |
|---|---|
_This text_ is italic. |
This text is italic. |
*This text* is italic |
This text is italic. |
| Syntax | Output |
|---|---|
Combined with **asterisks and _underscores_**. |
Combined with asterisks and underscores. |
Combined with __asterisks and *underscores*__. |
Combined with asterisks and underscores. |
Add a > before the quote.
> "Attitude is a little thing that makes a big difference." - Winston Churchill
OUTPUT:
"Attitude is a little thing that makes a big difference." - Winston Churchill
To create an ordered list, add line items with numbers followed by periods. Indent one or more items to create a nested list. The numbers don't have to be in numerical order, but the list should start with the number one.
| Syntax | Output |
|---|---|
1. Item 1 |
1. Item 1 |
2. Item 2 |
2. Item 2 |
3. Item 3 |
3. Item 3 |
To create an unordered list, add dashe (-), asterisk (*), or plus sign (+) before the items. Indent one or more items to create a nested list.
| Syntax | Output |
|---|---|
- Item 1 |
|
* Item 2 |
|
+ Item 3 |
|
Task lists allow you to create a list of items with checkboxes. In Markdown applications that support task lists, checkboxes will be displayed next to the content. To create a task list, add dashes (-) and brackets with a space ([ ]) in front of task list items. To select a checkbox, add an x in between the brackets ([x]).
- [x] Task 1
* [x] Task 2
+ [ ] Task 3OUTPUT:
- Task 1
- Task 2
- Task 3
There are two ways to create a link, Inline and reference-style. To create a link, enclose the link text in a square brackets ( [] ), follow it immediately with the URL in parentheses ( () ).
| Syntax | Output |
|---|---|
[Inline-style link](https://genesisgabiola.netlify.com/) |
Inline-style link |
Reference-style link][Arbitrary case-insensitive reference text] |
Reference-style link |
[You can use numbers for reference-style link definitions][1] |
You can use numbers for reference-style link definitions |
Or leave it empty and use the link text itself using [link text itself]
URLs and URLs in angle brackets will automatically get turned into links.
http://www.example.com or http://www.example.com and sometimes example.com (but not on Github, for example).
Some text to show that the reference links can follow later.
[arbitrary case-insensitive reference text]: https://genesisgabiola.netlify.com/
[1]: https://genesisgabiola.netlify.com/
[link text itself]: https://genesisgabiola.netlify.com/
Title is not required and it's optional, this will appear as a tooltip when the user hovers on the link. To add a title, enclose it in parentheses ( () ) after the URL.
| Syntax | Output |
|---|---|
Check my [website](https://genesisgabiola.netlify.com/ "Genesis Website"). |
Check my website. |
To quickly turn a URL or email address into a link, enclose it in angle brackets.
| Syntax | Output |
|---|---|
My website is <https://genesisgabiola.netlify.com> and my contact is <genesisgabiola@yahoo.com> |
My website is https://genesisgabiola.netlify.com and my contact is genesisgabiola@yahoo.com |
Two ways to add an an image.
| Syntax | Output |
|---|---|
Inline-style:  |
|
Reference-style: ![Markdown Logo][logo] |
This is the 2nd step for the reference-style image link: [logo]: https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 2"
They can't be added directly but you can add an image with a link to the video like this:
<a href="http://www.youtube.com/watch?feature=player_embedded&v=YOUTUBE_VIDEO_ID_HERE" target="_blank">
<img src="http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg" alt="IMAGE ALT TEXT HERE" width="240" height="180" border="10" />
</a>Or, in pure Markdown, but losing the image sizing and border:
[](http://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE)To denote a word or phrase as inline code block, enclose it with tick marks or backtique (`).
| Syntax | Output |
|---|---|
Press`Ctrl + C` |
Press Ctrl + C |
Inline code has back-ticks around it.
Shell Code:
```sh
npm install
npm start
```
OUTPUT:
npm install
npm startJavaScript Code:
```js
function add(num1, num2) {
return num1 + num2;
}
```
OUTPUT:
function add(num1, num2) {
return num1 + num2;
}Python Code:
```py
def add(num1, num2):
return num1 + num2
```
OUTPUT:
def add(num1, num2):
return num1 + num2To see what languages are available for highlighting, and how to write those language names, see the highlight.js demo page.
To display a literal character that would otherwise be used to format text in a Markdown document, add a backslash (\) in front of the character.
| Syntax | Output |
|---|---|
\- Without the backslash, this would be a bullet in an unordered list. |
- Without the backslash, this would be a bullet in an unordered list. |
If the word or phrase you want to denote as code includes one or more tick marks, you can escape it by enclosing the word or phrase in double tick marks (``).
| Syntax | Output |
|---|---|
``Use `code` in markdown.`` |
Use `code` in markdown. |
To create a table, use three or more hyphens (---) to make a column’s header, and use pipes (|) to separate each column.
| Name | Email | Job |
| -------- | -------------- | ----------- |
| John Doe | john@gmail.com | Programmer |
| Jane Doe | jane@gmail.com | Accountant |OUTPUT
| Name | Job | |
|---|---|---|
| John Doe | john@gmail.com | Programmer |
| Jane Doe | jane@gmail.com | Accountant |
The outer pipes (|) are optional, and you don't need to make the raw Markdown line up prettily. You can also use inline Markdown.
Markdown | Less | Pretty
--- | --- | ---
*Still* | `renders` | **nicely**
1 | 2 | 3OUTPUT:
| Markdown | Less | Pretty |
|---|---|---|
| Still | renders |
nicely |
| 1 | 2 | 3 |
You can align text in the columns to the left, right, or center by adding a colon (:) to the left, right, or on both side of the hyphens within the header row.
| Name | Email | Job |
| :------- | :------------: | ----------: |
| John Doe | john@gmail.com | Programmer |
| Jane Doe | jane@gmail.com | Accountant |OUTPUT:
| Name | Job | |
|---|---|---|
| John Doe | john@gmail.com | Programmer |
| Jane Doe | jane@gmail.com | Accountant |
To add a custom heading ID, enclose the custom ID in curly braces on the same line as the heading.
### Heading IDs {#heading-ids}You can link to headings with custom IDs in the file by creating a standard link with a number sign (#) followed by the custom heading ID.
| Syntax | Output |
|---|---|
[Heading IDs](#heading-ids) |
Heading IDs |
To strikethrough words, use two tilde (~~) symbols before and after the word, just like how we bold and italized the text.
| Syntax | Output |
|---|---|
~~This text~~ is strikethrough. |
<details>
<summary>Click to expand!</summary>
## Heading
1. A numbered
2. list
- With some
- Sub bullets
</details>OUTPUT:
Note:
- Make sure you have an empty line after the closing
</summary>tag. - Make sure you have an empty line after the closing
</details>tag if you have multiple collapsible sections.
A full description of TeX math symbols is beyond the scope of this cheatsheet. Here's a good reference, and you can try stuff out on CodeCogs. You can also play with formulae in the Markdown Here options page.
Here are some examples to try out:
$-b \pm \sqrt{b^2 - 4ac} \over 2a$
$x = a_0 + \frac{1}{a_1 + \frac{1}{a_2 + \frac{1}{a_3 + a_4}}}$
$\forall x \in X, \quad \exists y \leq \epsilon$The beginning and ending dollar signs ($) are the delimiters for the TeX markup.