Headings (1) #

Heading 2 ##

Heading 3 ###

Heading 4 ####

Heading 5 #####

Heading 6 ######

body text

Horizontal Line ---

This is the horizontal line

---

Line Breaks (Double rule) or <br>

In the editor: This line is above. This line is below. But these all output on the same line.

Solution 1:

Make sure that

Each separated line/element

Is 'Double spaced'

Solution 2:

Use <br>
To get things
On the next line, but closer

Text Formatting

Bolding: **text** or __text__

Bolded text done using **Bolded Text**

Bolded text done using __Bolded Text__

Italicising: *text* or _text_

Italicised text done using *Italicised text*

Italicised text done using _Italicised text_

Strikethrough: ~~text~~

strikethrough text done using ~~strikethrough text~~

Change font color: <font color = color>text</font>

Green Light, Red Light

you can use hexcodes too

Superscript <sup>text</sup> and Subscript <sub>text</sub>

A = B₁X₁ + B₂X₂² + C

Hyperlinking

Internally, within this markdown/ipynb headers

• E.g. Horizontal Line section
  • [Text](#formatted-header-name)
  • E.g. [Headings](#headings-1) gets you Headings
  • Good for making a directory / table of contents

To external site

• E.g. My Spotify Channel
  • [Text](https://www.website.com/)
  • E.g. [My Youtube Channel](https://www.youtube.com/@choonxyong/) gets you My Youtube Channel

Listing

Ordered listing 123

note that 123 works but abc doesnt...

1. text
   1. text
   2. text
2. text
   1. text
   2. text
      1. text
3. text
   1. text
   2. text

Unordered listing -

• text
  • text
  • text
• text
  • text
  • text
    • text
• text
  • text
  • text

Task Listing - [ ] / - [x]

• Task 1
• Task 2
• Task 3

Images

Recommendation: use publicly available image(s) that will readily load in.

Otherwise, user's system must also have the image(s) downloaded locally somewhere

Public Images <img src = "https://link_to_image/">

Arguments to call in <img>

<img 
   src = 'https://link_to_image/' 
   alt = 'alternate text if image cant load' 
   width="number_value"   
   height ="number_value"
   >

You can also embed link in image through:

<a href ="https://website"><img src = "https://link_to_image"></a>

Get a publicly available google drive image using:

<img src = 'https://drive.usercontent.google.com/download?id={GOOGLE_DRIVE_FILE_ID}'>

Notice How images fill into to the right until there's no more space, then goes down ... just like text

Use <br> to force vertical stacking of images

Examples:

Centering Images

<div align="center"><img src = "https://link_to_image"></div>

Tables

Think of the format as same as a pandas dataframe

Markdown

|col 1|col 2|col3|              < first row denote column headers
|-|--|------|                   < second row is just for delimiting headers from records(rows). Use '-' but notice how the number of '-' doesnt matter 
|row1_1 |row1_2|---|            < first row of records, notice putting '---' gives you literal dash values now
|N/A           |row2_2|row3_3|  < second row of records, notice how leading/trailing whitespace automatically controlled for

col 1	col 2	col3
row1_1	row1_2	---
N/A	row2_2	row3_3

Centering Table

Markdown

<div align="center">

TABLE

</div>

col 1	col 2	col3
row1_1	row1_2	---
N/A	row2_2	row3_3

Emojis 😂 ❤️

Find all the emojis here

Showable / Hidable Subsections

Note that for header-like style, need to use the html <h1> <h2> styling instead of the #

Subsection1

Here is the content in subsection1

I can even include subsubsection

SubSubSection1

Here is the content in subsubsection1

Subsection2

Here is the content in subsection2

Block text >

Example block text. Looks a lot like the telegram reply

Nested block text is possible

LaTeX (for the Mathematicians & Scientists) $MathExpression$ or $$MathExpression$$

if you want it to be part of text like $a^2 + b^2 = c^2$, use single $ like $a^2 + b^2 = c^2$

But if you want to put it in the center, use $$MathExpression$$, for example:

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

Entire full list of LaTeX expressions HERE

Greek letters: