Markdown cheat sheet — Complete syntax guide

This is a comprehensive reference for Markdown syntax. Every example below works in CodeInk's editor with real-time preview. Bookmark this page and come back whenever you need a quick refresher.

Headings

Use # symbols to create headings. The number of # symbols determines the heading level, from H1 (largest) to H6 (smallest).

Markdown

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

Best practice: use only one H1 per document (as the main title) and use H2-H4 for subsections. This improves accessibility and readability.

Text formatting

Markdown supports several inline text styles for emphasis and decoration.

Markdown

**Bold text**
*Italic text*
***Bold and italic***
~~Strikethrough~~
`Inline code`

Bold — wrap text with double asterisks or double underscores
Italic — wrap text with single asterisks or single underscores
Bold and italic — wrap text with triple asterisks
~~Strikethrough~~ — wrap text with double tildes
Inline code — wrap text with backticks

Paragraphs and line breaks

To create a new paragraph, leave a blank line between text blocks. For a line break within the same paragraph, end a line with two spaces or use <br>.

Markdown

This is the first paragraph.

This is the second paragraph.

This line has a break
right here.

Lists

Unordered lists

Use -, *, or + followed by a space. Indent with two or four spaces for nested lists.

Markdown

- Item one
- Item two
  - Nested item
  - Another nested item
- Item three

Ordered lists

Use numbers followed by a period. Markdown auto-numbers, so you can use 1. for every item.

Markdown

1. First item
2. Second item
3. Third item
   1. Sub-item
   2. Sub-item

Task lists

Task lists (checkboxes) are created with - [ ] for unchecked and - [x] for checked items.

Markdown

- [x] Write the draft
- [x] Review the content
- [ ] Publish the article

Links

Create links with [text](url) syntax. You can add an optional title that appears on hover.

Markdown

[Visit CodeInk](https://codeink.app)
[Link with title](https://codeink.app "CodeInk Editor")
[Relative link to a section](#headings)

Images

Images use the same syntax as links but with a ! prefix. The text inside brackets becomes the alt text.

Markdown

![Alt text](https://example.com/image.png)
![Alt text](https://example.com/image.png "Optional title")

Always include descriptive alt text for accessibility. The alt text describes the image for screen readers and when the image fails to load.

Code blocks

For multi-line code, use triple backticks with an optional language identifier for syntax highlighting in CodeInk.

Markdown

```javascript
function greet(name) {
  return `Hello, ${name}!`;
}
```

```python
def fibonacci(n):
    a, b = 0, 1
    for _ in range(n):
        yield a
        a, b = b, a + b
```

CodeInk supports syntax highlighting for 16+ languages including TypeScript, JavaScript, Python, Rust, Go, Java, C++, HTML, CSS, SQL, Bash, and more.

Blockquotes

Use > to create blockquotes. Nest them for multi-level quotes.

Markdown

> This is a blockquote.
>
> It can span multiple lines.
>
>> This is a nested blockquote.

Tables

Create tables using pipes | and hyphens -. Align columns with colons.

Markdown

| Feature     | Supported | Notes           |
|-------------|:---------:|----------------:|
| Headings    |    Yes    |    H1 through H6 |
| Bold/Italic |    Yes    |    Standard MD   |
| Tables      |    Yes    |    GFM syntax    |
| Diagrams    |    Yes    |    Via Mermaid   |

:--- — left-aligned (default)
:---: — center-aligned
---: — right-aligned

Horizontal rules

Create horizontal dividers with three or more hyphens, asterisks, or underscores on their own line.

Markdown

---
***
___

Footnotes

Footnotes allow you to add references without cluttering the main text. CodeInk supports GFM footnotes.

Markdown

Here is a sentence with a footnote[^1].

[^1]: This is the footnote content.

GitHub-style alerts

CodeInk supports GitHub-style alert blocks for callouts and admonitions.

Markdown

> [!NOTE]
> Useful information.

> [!TIP]
> Helpful advice.

> [!IMPORTANT]
> Key information.

> [!WARNING]
> Urgent information.

> [!CAUTION]
> Negative potential consequences.

Mermaid diagrams

CodeInk renders Mermaid diagrams directly in the preview. Use a fenced code block with the mermaid language identifier.

Markdown

```mermaid
graph TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Do something]
    B -->|No| D[Do something else]
```

Math with KaTeX

CodeInk supports KaTeX math expressions. Use single dollar signs for inline math and double dollar signs for display math.

Markdown

Inline: $E = mc^2$

Display:
$$
\int_0^\infty e^{-x} dx = 1
$$

All syntax above works in CodeInk with real-time preview. Open the editor to try any of these examples live.