<h1 align="center"> :black_circle: The Ultimate Markdown Cheat Sheet :black_circle: </h1> <div align="center"> <a href="https://github.com/lifeparticle/Markdown-Cheatsheet/actions/workflows/readme-checker.yml"> <img src="https://github.com/lifeparticle/Markdown-Cheatsheet/actions/workflows/readme-checker.yml/badge.svg" alt=".github/workflows/readme-checker.yml"> </a> </div>

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

<br/>

[!IMPORTANT] Check out the official documentation on GitHub to learn more about writing and formatting syntax. Additionally, you can read the latest updates and features on Markdown by visiting the GitHub changelog posts.

• Introduction
• Headings
• Text styles
  • Normal
  • Bold
  • Italic
  • Bold and Italic
  • Blockquotes
  • Monospaced
  • Underlined
  • Strike-through
  • Boxed
  • Subscript
  • Superscript
  • Text Color
  • Multiline
• Syntax Highlighting
  • Inline code
  • Code block
  • Diff Code block
• Alignments
• Tables
• Links
  • Inline
  • Reference
  • Footnote
  • Relative
  • Auto
  • Section
  • Hover
  • Enclosed
  • Highlight words and link it to a URL
• Images
  • Theme
    • Using picture tag
    • Using dark and light mode
• 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
• Code in titles
• Reference Labels
• Miscellaneous
  • Comments
  • Escaping Markdown Characters
  • Emojis
  • Line break
  • Back to top
• Bitbucket
• Azure DevOps Project wiki
• MDX
• Tools

Introduction

Markdown is a way of writing rich-text (formatted text) content using plain text formatting syntax. It is also a tool that converts the plain text formatting to HTML.

• 2004: John Gruber developed Markdown.
• 2014: CommonMark was established as a standard specification for Markdown to resolve inconsistencies and ambiguities in Markdown implementations. This initiative was spearheaded by John MacFarlane and backed by other Markdown enthusiasts to ensure a reliable and consistent specification.

This guide will provide you with a comprehensive understanding of the key commands in GitHub Flavored Markdown (GFM), it is a strict superset of CommonMark. You can read the full article, The Ultimate Markdown Cheat Sheet on Medium.

Headings

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

<!-- omit in toc -->

Heading 1

<!-- omit in toc -->

Heading 2

<!-- omit in toc -->

Heading 3

<!-- omit in toc -->

Heading 4

<!-- omit in toc -->

Heading 5

<!-- omit in toc -->

Heading 6

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

<!-- omit in toc --> <h1>Heading 1</h1> <!-- omit in toc --> <h2>Heading 2</h2> <!-- omit in toc --> <h3>Heading 3</h3> <!-- omit in toc --> <h4>Heading 4</h4> <!-- omit in toc --> <h5>Heading 5</h5> <!-- omit in toc --> <h6>Heading 6</h6>

Heading 1
=
Heading 2
-

<!-- omit in toc -->

Heading 1 <!-- markdownlint-disable MD003 -->

<!-- omit in toc -->

Heading 2 <!-- markdownlint-disable MD003 -->

Text styles

Normal

The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

Bold

Mac: <kbd>command+B</kbd>

Windows: <kbd>control+B</kbd>

**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.

<!-- markdownlint-disable-next-line MD050 -->

The quick brown fox jumps over the lazy dog.

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

Italic

Mac: <kbd>command+I</kbd>

Windows: <kbd>control+I</kbd>

*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.

<!-- markdownlint-disable-next-line MD049 -->

The quick brown fox jumps over the lazy dog.

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

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>

<!-- markdownlint-disable-next-line MD049 -->

The quick brown fox jumps over the lazy dog.

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

Blockquotes

Mac: <kbd>command+shift+.</kbd>

Windows: <kbd>control+shift+.</kbd>

> The quick brown fox jumps over the lazy dog.

<br>

> 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.

<br>

> 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.

<br>

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

The quick brown fox jumps over the lazy dog.

<br>

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.

<br>

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.

<br>

The quick brown fox jumps over the lazy dog.

Monospaced

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

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

Underlined

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

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

Strike-through

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

The quick brown fox jumps over the lazy dog.

<pre>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strike>Sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.</strike> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. <strike>Excepteur sint
occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</strike>
</pre>

<pre> Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strike>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</strike> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. <strike>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</strike> </pre>

<strike>

```js
console.log('Error');
```

</strike>

<strike>

console.log('Error');

</strike>

Boxed

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

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

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

Multiline

The quick
brown fox
jumps over
the lazy dog.

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

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).

You can use <kbd>command + e </kbd> on Mac or <kbd>control + e</kbd> on Windows to insert inline code.

Code block

<!-- markdownlint-disable MD040 -->

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

<!-- markdownlint-enable MD040 -->

```
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="left"> <!-- markdownlint-disable-next-line MD013 --> <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" alt="Vintage-style alarm clock with Roman numerals on its face, set on a surface covered with newspaper, with a blurred background."/> </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="center"> <!-- markdownlint-disable-next-line MD013 --> <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" alt="Vintage-style alarm clock with Roman numerals on its face, set on a surface covered with newspaper, with a blurred background."/> </p>

<p align="right">
<img