lifeparticle / Markdown-Cheatsheet

🔖 The Ultimate Markdown Cheat Sheet

⚫ The Ultimate Markdown Cheat Sheet ⚫

Important

Check out the official documentation on GitHub to learn more about writing and formatting syntax.

Markdown is a method for writing formatted text using a simple plain text format. This guide will provide you with a comprehensive understanding of the key commands in Markdown, aimed at enhancing your GitHub README.

You can read the full article on Medium, but here's a brief overview of the most popular commands.

• Headings
• Text styles
  • Normal
  • Bold
  • Italic
  • Bold and Italic
  • Blockquotes
  • Monospaced
  • Underlined
  • Strike-through
  • Boxed
  • Subscript
  • Superscript
  • Text Color
• Syntax Highlighting
  • Inline code
  • Code block
  • Diff Code block
• Alignments
• Tables
• Links
  • Inline
  • Reference
  • Footnote
  • Relative
  • Auto
  • Section
  • Hover
• Images
  • Theme
• Badges
• Lists
  • Ordered
  • Unordered
  • Task
• Buttons
  • Button with emoji
• Collapsible items (28 July 2023)
• Horizontal Rule
• Diagrams (19 July 2022)
• Mathematical expressions (19 July 2022)
• Alerts (8 January 2024)
• Mention people and teams
• Reference issues and pull requests
• Color models
• View Code
• Miscellaneous
  • Comments
  • Escaping Markdown Characters
• Hash symbol
  • Emojis
  • Line break
  • Back to top
• Bitbucket
• Azure DevOps Project wiki
• MDX
• Tools

Headings

# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 1
=
Heading 2
-

Heading 1

Heading 2

Text styles

Normal

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

Bold

**The quick brown fox jumps over the lazy dog.**
__The quick brown fox jumps over the lazy dog.__
<strong>The quick brown fox jumps over the lazy dog.</strong>

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

Italic

*The quick brown fox jumps over the lazy dog.*
_The quick brown fox jumps over the lazy dog._
<em>The quick brown fox jumps over the lazy dog.</em>

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

Bold and Italic

**_The quick brown fox jumps over the lazy dog._**
<strong><em>The quick brown fox jumps over the lazy dog.</em></strong>

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

Blockquotes

> The quick brown fox jumps over the lazy dog.
> The quick brown fox jumps over the lazy dog.
>
> The quick brown fox jumps over the lazy dog.
>
> The quick brown fox jumps over the lazy dog.
> The quick brown fox jumps over the lazy dog.
>> The quick brown fox jumps over the lazy dog.
>>> The quick brown fox jumps over the lazy dog.
> **The quick brown fox** *jumps over the lazy dog.*

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

Monospaced

<samp>The quick brown fox jumps over the lazy dog.</samp>

The quick brown fox jumps over the lazy dog.

Underlined

<ins>The quick brown fox jumps over the lazy dog.</ins>

The quick brown fox jumps over the lazy dog.

Strike-through

~~The quick brown fox jumps over the lazy dog.~~

The quick brown fox jumps over the lazy dog.

Boxed

<table><tr><td>The quick brown fox jumps over the lazy dog.</td></tr></table>

The quick brown fox jumps over the lazy dog.

Subscript

log<sub>2</sub>(x)
Subscript <sub>The quick brown fox jumps over the lazy dog.</sub>

log₂(x)

Subscript _{The quick brown fox jumps over the lazy dog.}

Superscript

2 <sup>53-1</sup> and -2 <sup>53-1</sup>
Superscript <sup>The quick brown fox jumps over the lazy dog.</sup>

2 ^53-1 and -2 ^53-1

Superscript ^{The quick brown fox jumps over the lazy dog.}

Text Color

Using MathJax syntax:

Color Name	Code	Example
Apricot	$\color{Apricot}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$	$\color{Apricot}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$
Aquamarine	$\color{Aquamarine}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$	$\color{Aquamarine}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$
Bittersweet	$\color{Bittersweet}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$	$\color{Bittersweet}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$
Black	$\color{Black}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$	$\color{Black}{The\ quick\ brown\ fox\ jumps\ over\ the\ lazy\ dog.}$

Full Table

Syntax Highlighting

Inline code

A class method is an instance method of the class object. When a new class is created, an object of type Class is initialized and assigned to a global constant (Mobile in this case).

Code block

public static String monthNames[] = {"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"};

```
public static String monthNames[] = {"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"};
```

public static String monthNames[] = {"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"};

```java
public static String monthNames[] = {"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"};
```

Refer to this and this GitHub document to find all the valid keywords.

Diff Code block

## git diff a/test.txt b/test.txt
diff --git a/a/test.txt b/b/test.txt
index 309ee57..c995021 100644
--- a/a/test.txt
+++ b/b/test.txt
@@ -1,8 +1,6 @@
-The quick brown fox jumps over the lazy dog
+The quick brown fox jumps over the lazy cat

 a
-b
 c
 d
-e
 f

```diff
## git diff a/test.txt b/test.txt
diff --git a/a/test.txt b/b/test.txt
index 309ee57..c995021 100644
--- a/a/test.txt
+++ b/b/test.txt
@@ -1,8 +1,6 @@
-The quick brown fox jumps over the lazy dog
+The quick brown fox jumps over the lazy cat

 a
-b
 c
 d
-e
 f
```

- Text in Red
+ Text in Green
! Text in Orange
# Text in Gray
@@ Text in Purple and bold @@

```diff
- Text in Red
+ Text in Green
! Text in Orange
# Text in Gray
@@ Text in Purple and bold @@
```

Alignments

<p align="left">
<img src="https://images.unsplash.com/photo-1415604934674-561df9abf539?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2772&q=80" width="100" height="100" border="10"/>
</p>

<p align="center">
<img src="https://images.unsplash.com/photo-1415604934674-561df9abf539?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2772&q=80" width="100" height="100" border="10"/>
</p>

<p align="right">
<img src="https://images.unsplash.com/photo-1415604934674-561df9abf539?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2772&q=80" width="100" height="100" border="10"/>
</p>

<h3 align="center"> My latest Medium posts </h3>

My latest Medium posts

Tables

<table>
<tr>
<td width="33%"">
The quick brown fox jumps over the lazy dog.
</td>
<td width="33%">
The quick brown fox jumps over the lazy dog.
</td>
<td width="33%">
The quick brown fox jumps over the lazy dog.
</td>
</tr>
</table>

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

| Default | Left align | Center align | Right align |
| - | :- | :-: | -: |
| 9999999999 | 9999999999 | 9999999999 | 9999999999 |
| 999999999 | 999999999 | 999999999 | 999999999 |
| 99999999 | 99999999 | 99999999 | 99999999 |
| 9999999 | 9999999 | 9999999 | 9999999 |

| Default    | Left align | Center align | Right align |
| ---------- | :--------- | :----------: | ----------: |
| 9999999999 | 9999999999 | 9999999999   | 9999999999  |
| 999999999  | 999999999  | 999999999    | 999999999   |
| 99999999   | 99999999   | 99999999     | 99999999    |
| 9999999    | 9999999    | 9999999      | 9999999     |

Default    | Left align | Center align | Right align
---------- | :--------- | :----------: | ----------:
9999999999 | 9999999999 | 9999999999   | 9999999999
999999999  | 999999999  | 999999999    | 999999999
99999999   | 99999999   | 99999999     | 99999999
9999999    | 9999999    | 9999999      | 9999999

Default	Left align	Center align	Right align
9999999999	9999999999	9999999999	9999999999
999999999	999999999	999999999	999999999
99999999	99999999	99999999	99999999
9999999	9999999	9999999	9999999

Default	Left align	Center align	Right align
9999999999	9999999999	9999999999	9999999999
999999999	999999999	999999999	999999999
99999999	99999999	99999999	99999999
9999999	9999999	9999999	9999999

Default	Left align	Center align	Right align
9999999999	9999999999	9999999999	9999999999
999999999	999999999	999999999	999999999
99999999	99999999	99999999	99999999
9999999	9999999	9999999	9999999

<table>
<tr>
<th>Heading 1</th>
<th>Heading 2</th>
</tr>
<tr>

<td>

| A | B | C |
|--|--|--|
| 1 | 2 | 3 |

</td><td>

| A | B | C |
|--|--|--|
| 1 | 2 | 3 |

</td></tr> </table>

Heading 1	Heading 2
A B C 1 2 3	A B C 1 2 3

| A | B | C |
|---|---|---|
| 1 | 2 | 3 <br/> 4 <br/> 5 |

A	B	C
1	2	3 4 5

<table>
<tr>
<th>Before Hoisting</th>
<th>After Hoisting</th>
</tr>
<tr>
<td>
<pre lang="js">
console.log(fullName); // undefined
fullName = "Dariana Trahan";
console.log(fullName); // Dariana Trahan
var fullName;
</pre>
</td>
<td>
<pre lang="js">
var fullName;
console.log(fullName); // undefined
fullName = "Dariana Trahan";
console.log(fullName); // Dariana Trahan
</pre>
</td>
</tr>
</table>

Before Hoisting	After Hoisting
console.log(fullName); // undefined fullName = "Dariana Trahan"; console.log(fullName); // Dariana Trahan var fullName;	var fullName; console.log(fullName); // undefined fullName = "Dariana Trahan"; console.log(fullName); // Dariana Trahan

Links

Inline

[The-Ultimate-Markdown-Cheat-Sheet](https://github.com/lifeparticle/Markdown-Cheatsheet)

The-Ultimate-Markdown-Cheat-Sheet

Reference

[The-Ultimate-Markdown-Cheat-Sheet][reference text]

[The-Ultimate-Markdown-Cheat-Sheet][1]

[Markdown-Cheat-Sheet]

[reference text]: https://github.com/lifeparticle/Markdown-Cheatsheet
[1]: https://github.com/lifeparticle/Markdown-Cheatsheet
[Markdown-Cheat-Sheet]: https://github.com/lifeparticle/Markdown-Cheatsheet

The-Ultimate-Markdown-Cheat-Sheet

The-Ultimate-Markdown-Cheat-Sheet

Markdown-Cheat-Sheet

Footnote

Footnote.¹

Some other important footnote.²

Footnote.[^1]

Some other important footnote.[^2]

[^1]: This is footnote number one.
[^2]: Here is the second footnote.

Relative

[Example of a relative link](rl.md)

Example of a relative link

Auto

Visit https://github.com/

Visit https://github.com/

Section

Hover

You can use BinaryTree to create markdown tables.

You can use BinaryTree to create markdown tables.

Images

![alt text](https://images.unsplash.com/photo-1415604934674-561df9abf539?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=100&q=80)

![alt text][image]

[image]: https://images.unsplash.com/photo-1415604934674-561df9abf539?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=100&q=80

<img src="https://images.unsplash.com/photo-1415604934674-561df9abf539?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2772&q=80" width="100" height="100" border="10"/>

<img src="https://media.giphy.com/media/qLHzYjlA2FW8g/giphy.gif" />

<img src="https://img.shields.io/badge/theultimatemarkdowncheatsheet-brightgreen.svg" />

Theme

The HTML <picture> element, along with the prefers-color-scheme media feature, enables you to dynamically adjust images according to the user's color scheme preference, providing options for both light and dark modes.

For example, the code snippet below demonstrates how to display a dark-themed BinaryTree logo when the user's device is set to a dark mode, and a light-themed BinaryTree logo for light mode settings:

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://github.com/lifeparticle/lifeparticle/blob/master/gh_social_dark.png">
  <source media="(prefers-color-scheme: light)" srcset="https://github.com/lifeparticle/lifeparticle/blob/master/gh_social_light.png">
  <img alt="BinaryTree" src="https://github.com/lifeparticle/lifeparticle/blob/master/gh_social_light.png" width="200">
</picture>

Badges

![GitHub forks](https://img.shields.io/github/forks/lifeparticle/Markdown-Cheatsheet?style=for-the-badge)

Lists

Ordered

1. One
2. Two
3. Three

1. One
2. Two
3. Three

1. First level
    1. Second level
        - Third level
            - Fourth level
2. First level
    1. Second level
3. First level
    1. Second level

1. First level
   1. Second level
      • Third level
        • Fourth level
2. First level
   1. Second level
3. First level
   1. Second level

Unordered

* 1
* 2
* 3

+ 1
+ 2
+ 3


- 1
- 2
- 3

• 1
• 2
• 3

• 1
• 2
• 3

• 1
• 2
• 3

- First level
    - Second level
        - Third level
            - Fourth level
- First level
    - Second level
- First level
    - Second level

• First level
  • Second level
    • Third level
      • Fourth level
• First level
  • Second level
• First level
  • Second level

<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
<li>Fourth item</li>
</ul>

• First item
• Second item
• Third item
• Fourth item

Task

- [x] Fix Bug 223
- [ ] Add Feature 33
- [ ] Add unit tests

• Fix Bug 223
• Add Feature 33
• Add unit tests

Buttons

<kbd>cmd + shift + p</kbd>

cmd + shift + p

<kbd> <br> cmd + shift + p <br> </kbd>

 
 cmd + shift + p 
 

<kbd>[Markdown-Cheatsheet](https://github.com/lifeparticle/Markdown-Cheatsheet)</kbd>

Markdown-Cheatsheet

[<kbd>Markdown-Cheatsheet</kbd>](https://github.com/lifeparticle/Markdown-Cheatsheet)

Markdown-Cheatsheet

Button with emoji

 
Markdown-Cheatsheet ↗️
 

<kbd> <br> [Markdown-Cheatsheet](https://github.com/lifeparticle/Markdown-Cheatsheet) <br> </kbd>

Collapsible items (28 July 2023)

<details>
  <summary>Markdown</summary>

-  <kbd>[Markdown Editor](https://binarytree.dev/me)</kbd>
-  <kbd>[Table Of Content](https://binarytree.dev/toc)</kbd>
-  <kbd>[Markdown Table Generator](https://binarytree.dev/md_table_generator)</kbd>

</details>

Markdown

• Markdown Editor
• Table Of Content
• Markdown Table Generator

Horizontal Rule

---
***
___

---

---

---

Diagrams (19 July 2022)

pie
"Movies" : 80
"TV shows" : 20

pie
"Movies" : 80
"TV shows" : 20

Mathematical expressions (19 July 2022)

Important

Check out the official documentation on GitHub to learn more about writing and formatting MathJax syntax.

This is an inline math expression $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$

This is an inline math expression $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$

$$
x = {-b \pm \sqrt{b^2-4ac} \over 2a}
$$

$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$

Alerts (8 January 2024)

> [!NOTE]
> Essential details that users should not overlook, even when browsing quickly.

> [!TIP]
> Additional advice to aid users in achieving better outcomes.

> [!IMPORTANT]
> Vital information required for users to attain success.

> [!WARNING]
> Urgent content that requires immediate user focus due to possible risks.

> [!CAUTION]
> Possible negative outcomes resulting from an action.

Note

Essential details that users should not overlook, even when browsing quickly.

Tip

Additional advice to aid users in achieving better outcomes.

Important

Vital information required for users to attain success.

Warning

Urgent content that requires immediate user focus due to possible risks.

Caution

Possible negative outcomes resulting from an action.

Mention people and teams

In issuse:

@lifeparticle

Example

Reference issues and pull requests

In issuse:

#1
#10

Example

In markdown file:

https://github.com/lifeparticle/Markdown-Cheatsheet/issues/1
https://github.com/lifeparticle/Markdown-Cheatsheet/pull/10

#1

#10

Color models

`#ffffff`
`#000000`

Example

View Code

Click either the Code (top right) or Raw (top left) option to see the markdown code.

Note

Make sure you have clicked the markdown file to see the above view.

Miscellaneous

Comments

<!--
Lorem ipsum dolor sit amet
-->

Escaping Markdown Characters

Before escaping

*   Asterisk
\   Backslash
`   Backtick
{}  Curly braces
.   Dot
!   Exclamation mark
#   Hash symbol
-   Hyphen symbol
()  Parentheses
+   Plus symbol
[]  Square brackets
_   Underscore`

• Asterisk \ Backslash ` Backtick {} Curly braces . Dot ! Exclamation mark

Hash symbol

• Hyphen symbol () Parentheses

• Plus symbol [] Square brackets _ Underscore

After escaping

\*   Asterisk
\\   Backslash
\`   Backtick
\{}  Curly braces
\.   Dot
\!   Exclamation mark
\#   Hash symbol
\-   Hyphen symbol
\()  Parentheses
\+   Plus symbol
\[]  Square brackets
\_   Underscore

* Asterisk \ Backslash ` Backtick {} Curly braces . Dot ! Exclamation mark # Hash symbol - Hyphen symbol () Parentheses + Plus symbol [] Square brackets _ Underscore

Emojis

:octocat:

Complete list of github markdown emoji markup

Line break

You can use <br> to insert a single line break. Make sure to use an em space  . For example:

<table><tr><td> <br> The quick brown fox jumps over the lazy dog. <br> </td></tr></table>

The quick brown fox jumps over the lazy dog.

Or

<table><tr><td> <br><br><br> The quick brown fox jumps over the lazy dog. <br><br><br> </td></tr></table>

The quick brown fox jumps over the lazy dog.

Back to top

First place the following code at start of your markdown file

<a name="top"></a>

Then use one of the following code at the place you want to return to top.

Back to top

⬆️

[Back to top](#top)

[:arrow_up:](#top)

Bitbucket

Bitbucket Supported Markdown for READMEs. Also, create a table of contents.

Azure DevOps Project wiki

Azure DevOps Supported Markdown for Project wiki.

MDX

You can write JSX in your markdown document using MDX.

Tools

1. Create a Markdown table of content - binarytree, github-markdown-toc
2. Create an empty Markdown table - Tablesgenerator
3. Convert Excel to Markdown table - Tableconvert
4. Markdown preview for Sublime Text 3 - Packagecontrol
5. Markdown preview Visual Studio Code - Markdown Preview Enhanced
6. A collection of awesome markdown goodies - Awesome Markdown

Footnotes

1. This is footnote number one. ↩

2. Here is the second footnote. ↩