Markdown

Markdown is the language used in .md files. It's mostly used to write simple documents such as

  • πŸ“ Git-related documents (ex: README.md, CONTRIBUTING.md...)
  • 🏫 Documentation (ex: GIT wikis, see documentation tools...)
  • πŸ—ƒοΈ Websites (ex: GitHub Pages, see static sites generators...)
  • πŸŽ‰ Articles
  • πŸ–ΌοΈ Presentations (ex: slick)
  • ...

Note that you can use HTML inside Markdown files πŸ’«.

Resources

Editors


πŸͺ΅ Most used elements πŸͺ΅

Paragraphs

A paragraph is a block of text. Leave a blank line to close it.

Here is a text
that continues here.

Here is a text
\
that continues here. Do not use this uncommon syntax.

Here is a text that continues here.

Here is a text
that continues here. Do not use this uncommon syntax.


Basic style

  • bold: **bold** or __bold__
  • italic: *italic* or _italic_
  • bold+italic: ***bold+italic*** or ___bold+italic___
  • crossed text: ~~crossed text~~ or <s>crossed text</s>
  • underline: <u>underline</u>

Titles

The more # you add, the smaller your title becomes.

# h1 - huge title
## h2
### h3
#### h4
##### h5
###### h6 - tiny title
h1 - huge title
h2
h3
h4
h5
h6 - tiny title

Good practice 🧹: make sure to leave a space after #.


🌿 Other elements 🌿

Lists

Use *, +, or - to create unordered lists. Use n. for ordered lists.

1. an item
2. an item
    * an item
    * an item
3. an item
  1. an item
  2. an item
    • an item
    • an item
  3. an item

Links

  • example: [example](https://example.com)
  • https://example.com: <https://example.com>
  • If supported, you can add a title [placeholder](URL "title")

Images

  • ![alt](URL) is the same as <img src="URL" alt="alt">
  • ![alt](URL "title") with a title <img [...] title="title">

Comments

[comment]: <> (a comment)
[//]: <> (a comment)
[//]: # (a comment)

Code

Code inside a sentence is called inline code. You can write inline code in inverted quotes.

  • inline code: `inline code`
  • You can write some code blocks with syntax highlighting using 3 inverted quotes, then the highlighting language (ex: c, java, diff...).
```diff
unchanged
- removed
+ added
```
unchanged
- removed
+ added

Quotes

> some quote

some quote


Horizontal separators

***
---
___

It will work the same if you add more than 3 stars/...



πŸ₯₯ Extended Markdown πŸ₯₯

Extended features are available on most Markdown interpreters (ex: GitHub), but they are not available by default.

Tables

| Column name | Column name |
| --- | --- |
| tab[0][0] | tab[0][1] |
| tab[1][0] | tab[1][1] |
Column name Column name
tab[0][0] tab[0][1]
tab[1][0] tab[1][1]

You may also note that you can add more than 3 hyphens (---). And, you can use : to align values inside a column.

  • :---: align left
  • ---:: align right
  • :---:: align center

Checkbox

* [ ] not checked
* [x] checked
  • not checked
  • checked

Emojis

You can write :emoji: to render an emoji, with "emoji" the one you want. It works on GitHub, and some parsers are also supporting these. Otherwise, you may directly copy-paste emojis.


🍹 Using HTML 🍹

You can use HTML inside your Markdown.

Markdown HTML
## Title <h2>title</h2>
**bold** <b>bold</b>
*italic* <i>bold</i>
~~crossed text~~ <s>strike through</s>
a list see <ul>, <ol>, and <li>
`code` <code>code</code>
[link](url) <a href="URL">link</a>
![alt](url) <img src="URL" alt="alt">
> text <blockquote>text</blockquote>
--- <hr>
blank line <br>

Markdown inside HTML

You can use Markdown inside HTML, but you need to leave a blank line after the leading tag.

<div>
**Here**, you cannot use Markdown.

**But**, here you can.
</div>
**Here**, you cannot use Markdown.


But, here you can.


Center something

<div align="center">

This text is **centered**
</div>

This text is centered

Dropdowns

<details open>
<summary>Dropdown open</summary>
Content
</details>
Dropdown open Content
<details>
<summary><b>Click here to expand</b>
A short description
</summary><hr>

A long description
</details>
Click here to expand

A short description


A long description


Other nice HTML tags

Tag Preview
kbd CTRL+X
sup (used in footnotes) [1]: From XXX
[2]: Notation used in XXX
dl, dt (keyword), and dd (definition).
(the definition is usually indented, so it looks better)
Keyword
definition
abbr (show a note on hover) some text
mark This word has a yellow background.
ruby and rt (put some text above another one)

Some titleversion 5.0
progress 50%

πŸ‘» To-do πŸ‘»

Stuff that I found, but never read/used yet.