tags.
---
## Markdown Checkbox Generator
URL: https://mdutil.com/tools/markdown-checkbox
### How do you make a checkbox in Markdown?
Start a list item with a hyphen, then add square brackets: `- [ ] task` renders an unchecked checkbox and `- [x] task` a checked one. The space inside the empty brackets is required. This task list syntax comes from GitHub Flavored Markdown, so it works on GitHub, GitLab, Obsidian and Notion, but not in original Markdown.
```markdown
- [ ] Unchecked task
- [x] Completed task
```
Renders as a bulleted list where each item carries a checkbox — the first empty, the second ticked. On GitHub and GitLab the boxes are clickable and toggling one rewrites the underlying Markdown.
### Markdown checkbox syntax explained
A checkbox is not a standalone element — it is a list item with a state marker. Get the list marker, the brackets and the spacing right and the checkbox appears; miss any of the three and you get literal square brackets on the page.
#### Basic checked and unchecked items
Any unordered list marker works: hyphen, asterisk or plus. Inside the brackets, a single space means unchecked and a lowercase x means checked. A capital X is also accepted by GitHub Flavored Markdown.
```markdown
- [ ] Write the migration script
- [x] Review the schema change
* [ ] Asterisk markers work too
+ [x] So do plus signs
```
Four checkbox items in one list: items one and three unchecked, items two and four ticked.
#### Nested subtasks
Indent a child item by two spaces to nest it under its parent. GitHub counts nesting from the parent's content column, so keep indentation consistent — mixing tabs and spaces is the most common reason nesting silently flattens.
```markdown
- [ ] Ship v2 release
- [x] Freeze the API surface
- [ ] Update the changelog
- [ ] Add migration notes
- [x] Cut the release branch
```
A two-level hierarchy. The parent tasks sit flush left, subtasks are indented one level, and the migration note is indented two levels.
#### Formatting inside a task item
Task item text is ordinary Markdown, so bold, links, inline code and strikethrough all work. Strikethrough on a completed item is a common convention for making done work visually recede.
```markdown
- [x] ~~Migrate the legacy `users` table~~
- [ ] **Blocked:** waiting on [ticket #482](https://example.com/482)
- [ ] Rename `getUserByID` to `getUserById`
```
The first item is ticked with struck-through text; the second shows a bold label plus a live link; the third shows two inline code spans.
#### Mistakes that break the checkbox
Three formatting errors account for almost every broken task list. All three render as plain text with the brackets visible instead of a checkbox.
```markdown
- [] Missing the space inside the brackets
- [x]No space after the closing bracket
[ ] No list marker at the start of the line
```
None of these three lines produce a checkbox. Each is displayed literally, brackets and all.
#### HTML fallback for parsers without task lists
When a renderer does not support GitHub Flavored Markdown task lists but does allow raw HTML, use an input element. Add disabled so readers cannot toggle a state that is never saved anywhere.
```markdown
```
Produces the same visual list of checkboxes, rendered by the browser rather than the Markdown parser, with the boxes greyed out and non-interactive.
#### Checkboxes in an ordered list
The bracket marker also attaches to numbered list items, which is useful when steps must be followed in order rather than picked off in any sequence.
```markdown
1. [x] Install the CLI
2. [x] Authenticate
3. [ ] Run the first deploy
```
A numbered list where each step carries a checkbox; the first two are ticked. GitHub and GitLab both support this form.
### Where Markdown checkboxes work
Task lists are a GitHub Flavored Markdown extension, not part of the original Markdown spec, so support is far less universal than for bold or headings. Interactivity varies even among platforms that render the boxes.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub | Full | Clickable in issues, PRs, comments and wikis; toggling edits the source. Read-only in README files. |
| GitLab | Full | Clickable in issues, merge requests and wikis, with a progress counter on the list. |
| Obsidian | Full | Clickable in reading and live preview modes; custom states such as [/] are supported by themes. |
| Notion | Partial | Pasting - [ ] converts it into a native to-do block rather than keeping Markdown syntax. |
| VS Code preview | Partial | Boxes render but are not clickable; extensions add toggling in the editor. |
| Discord / Slack | None | Neither supports task lists. Use a bullet list with ☐ and ☑ characters instead. |
| Reddit | None | The Markdown editor renders - [ ] as literal text with the brackets visible. |
### How to generate a Markdown checkbox list
1. **Enter the task text** — Type the label for your tasks. The generator numbers each item so you get a ready-to-edit skeleton rather than repeated identical lines.
2. **Set the first item state** — Choose unchecked or checked to see exactly how the [ ] and [x] markers differ in the output.
3. **Pick the item count and indent level** — Choose how many items to generate, and set an indent level if the list is meant to nest under an existing parent task.
4. **Copy the output** — Copy the Markdown, or switch to the HTML tab if your platform does not support GitHub Flavored Markdown task lists.
5. **Check the preview** — Open the preview tab to confirm the boxes render and the nesting lands where you expect before pasting into your issue or README.
### Frequently asked questions
**How do I create a checkbox in Markdown?**
Write a list item whose text begins with square brackets: - [ ] for an unchecked box and - [x] for a checked one. The hyphen, the space after it, the bracket pair and the space after the closing bracket are all required. Asterisks and plus signs work as list markers too.
**Why is my Markdown checkbox not rendering?**
There are four common causes. You wrote - [] with no space inside the brackets. You omitted the space after the closing bracket. You forgot the list marker at the start of the line. Or the platform does not support GitHub Flavored Markdown task lists at all, in which case the brackets always show literally.
**How do I create nested or indented checkboxes?**
Indent the child item by two spaces relative to its parent, then write the checkbox as normal. Each additional level adds another two spaces. Keep the indentation consistent and avoid mixing tabs with spaces, because a mismatch makes the child item render as a sibling instead of a subtask.
**Which platforms support Markdown checkboxes?**
GitHub, GitLab, Obsidian, Typora, Notion, Joplin, Bitbucket and most static site generators that use a GitHub Flavored Markdown parser. Discord, Slack, Reddit and strict CommonMark parsers do not support them and will show the brackets as plain text.
**Does a capital X work in a Markdown checkbox?**
Yes. GitHub Flavored Markdown treats - [X] and - [x] identically, both producing a checked box. Lowercase is the more common convention and is what most editors and formatters normalise to, so prefer it for consistency across a repository.
**How do I make Markdown checkboxes clickable?**
Clickability is a platform feature, not a syntax feature. On GitHub and GitLab, task lists inside issues, pull requests, merge requests and wiki pages are clickable, and toggling a box rewrites the stored Markdown. In README files and static sites the same syntax renders read-only.
**What can I use if my platform does not support checkboxes?**
Two workarounds cover most cases. Use the Unicode ballot characters in a normal bullet list, such as ☐ for open and ☑ for done. Or, if raw HTML is allowed, write an input element with type checkbox and the disabled attribute so the box renders without being interactive.
**Can I use bold text, links or code inside a task list item?**
Yes. Everything after the closing bracket is parsed as normal inline Markdown, so bold, italics, inline code, links, images and strikethrough all work. Marking a finished item with strikethrough is a common convention for visually retiring completed work.
**What is the difference between a Markdown checkbox and a task list?**
They describe the same feature at different scopes. A checkbox is one list item written as - [ ] or - [x]; a task list is the list containing them. The specification name is task list, while checkbox is what most people search for.
**Do Markdown checkboxes work in Discord or Slack?**
No. Neither platform implements GitHub Flavored Markdown task lists, so - [ ] appears as literal text with the brackets visible. Use a bullet list with the ☐ and ☑ characters, or with emoji, to convey the same open and done states in chat.
---
## Markdown Code Block Generator
URL: https://mdutil.com/tools/markdown-code-block
### How do you create a code block in Markdown?
Wrap your code in triple backticks on their own lines, and put the language name directly after the opening fence. The language identifier is what switches on syntax highlighting. For a short snippet inside a sentence, use single backticks instead. Four-space indentation also creates a code block, but it cannot carry a language.
```markdown
```python
print("Hello, Markdown!")
```
```
Renders as a fenced code block with Python syntax highlighting, and compiles to .
### Markdown code block syntax explained
Markdown has three ways to show code: fenced blocks, indented blocks and inline spans. Fenced blocks are the modern default because they are the only ones that accept a language identifier.
#### Fenced code block with a language
Three backticks open the block, three close it, and the language name goes immediately after the opening fence with no space. This is the form GitHub, GitLab, Obsidian, Discord and every static site generator understand.
```markdown
```javascript
export function slugify(title) {
return title.toLowerCase().replace(/\s+/g, "-");
}
```
```
A highlighted JavaScript block. Without the language tag the same code renders as plain, unhighlighted text.
#### Language identifiers for syntax highlighting
The identifier is just a short name the highlighter recognises. These are the ones you will reach for most often; GitHub accepts more than 200 through its Linguist library, including aliases such as js, ts, py, sh, yml, cs and c++.
```markdown
```javascript ```typescript ```python ```java
```c ```cpp ```csharp ```go
```rust ```swift ```kotlin ```php
```ruby ```bash ```sql ```json
```yaml ```html ```css ```diff
```
Each name selects a different grammar. Unknown identifiers are not an error — the renderer simply falls back to unhighlighted text.
#### Indented code block (four spaces)
Indenting every line by four spaces or one tab is the original Markdown code block, from before fences existed. It still works everywhere, but it accepts no language and breaks as soon as your code contains its own indentation.
```markdown
int main(void) {
printf("Hello, Markdown!\n");
return 0;
}
```
A plain, unhighlighted code block. The four leading spaces are stripped from every line.
#### Inline code inside a sentence
Single backticks mark a short span of code inside running text — a variable, a flag, a command. Use double backticks as the delimiter when the span itself contains a backtick.
```markdown
Run `npm run build` before deploying.
The `` ` `` character opens an inline code span.
```
The first line shows npm run build in monospace; the second displays a literal backtick without ending the span.
#### Diff blocks for showing changes
The diff identifier colours lines by their first character: minus for removals, plus for additions, space for untouched context. It is the cleanest way to show a patch in a README or pull request comment.
```markdown
```diff
- const timeout = 1000;
+ const timeout = 5000;
retry(request, { timeout });
```
```
GitHub and GitLab tint the removed line red and the added line green; the unchanged line stays neutral.
#### Escaping backticks and nesting fences
To show a fenced block inside a fenced block, make the outer fence longer than the inner one. Four backticks can contain three, five can contain four, and so on.
```markdown
````markdown
```js
console.log("this fence stays visible");
```
````
```
The inner triple backticks are printed literally instead of closing the block early.
### Where Markdown code blocks work
Fenced blocks are near-universal, but the size of the language list and the extras built on top of it vary a lot between platforms.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub / GitLab | Full | 200+ languages via Linguist, diff colouring, and collapsible blocks inside . |
| Discord | Full | ```lang works in messages, limited to the languages highlight.js ships with. |
| Slack | Partial | ``` creates a code block, but the language tag is ignored and nothing is highlighted. |
| Obsidian | Full | Prism-based highlighting, plus code blocks that render as diagrams, e.g. mermaid. |
| Notion | Full | Typing ``` converts to a code block; the language is then set from a dropdown. |
| Reddit | Full | Fenced blocks work in the current editor; old.reddit.com needs four-space indentation. |
| VS Code | Full | Highlighted in the Markdown preview and inside the editor itself. |
### How to make a code block in Markdown
1. **Choose a block type** — Pick a fenced block for anything multi-line, an indented block for legacy Markdown processors, or inline code for a snippet inside a sentence.
2. **Select a language** — Choose the language identifier that matches your code so the renderer applies syntax highlighting. Leave it as plain text for logs and console output.
3. **Add a filename (optional)** — For fenced blocks, type a filename to emit a title attribute — useful when a snippet belongs to a specific file in a tutorial.
4. **Paste your code and copy** — Paste the code into the editor, check the preview tab, then copy the Markdown, or switch to the HTML tab if you need markup.
### Frequently asked questions
**How do I create a code block in Markdown?**
Put three backticks on the line before your code and three backticks on the line after it. Add a language name straight after the opening fence, such as python or javascript, to turn on syntax highlighting. Indenting every line by four spaces also produces a code block, but it cannot carry a language.
**How do I specify a language in a Markdown code block?**
Write the identifier immediately after the opening triple backticks, with no space between them, for example ```python. The identifier is case-insensitive on most renderers. Indented code blocks have nowhere to put a language, which is the main reason fenced blocks are preferred.
**What languages are supported in Markdown code blocks?**
The list depends on the renderer. GitHub recognises more than 200 through its Linguist library. The identifiers you will use most are javascript, typescript, python, java, c, cpp, csharp, go, rust, swift, kotlin, php, ruby, bash, powershell, sql, json, yaml, toml, html, css, xml, markdown and diff. Common aliases such as js, ts, py, sh, yml and cs also work.
**What is the language identifier for C in Markdown?**
Use c for C, cpp for C++ and csharp for C#. GitHub also accepts the aliases c++ and cs. Because the identifier is only a hint to the highlighter, an unrecognised name is never an error — the block simply renders without colouring.
**What is the difference between fenced and indented code blocks?**
Fenced blocks use triple backticks and accept a language identifier, a filename and other metadata, so they support syntax highlighting. Indented blocks use four spaces per line, come from the original 1.0 Markdown spec, and support none of that. Indented blocks are still handy inside list items, where a fence can confuse older parsers.
**How do I escape backticks inside a code block?**
Make the fence longer than the backtick run you want to display. Four backticks can wrap a block that contains three, and five can wrap one that contains four. For inline code, use double backticks as the delimiter and leave a space next to the content, so that a single backtick inside stays visible.
**How do I show a diff in Markdown?**
Use diff as the language identifier, then prefix removed lines with a minus sign, added lines with a plus sign, and leave unchanged lines starting with a space. GitHub, GitLab and most GitHub Flavored Markdown renderers colour the result red and green automatically.
**How do I add a filename to a Markdown code block?**
There is no single standard. GitHub and many documentation themes read a title attribute after the language, as in ```js title="app.js". VuePress uses ```js:app.js, and some Jekyll setups use fileName="app.js". Renderers that do not understand the extra text ignore it, so the block still displays correctly.
**Can you add line numbers to Markdown code blocks?**
Not in plain Markdown. Line numbers come from the syntax highlighter, not the Markdown spec, so they depend on the platform. Prism and highlight.js both offer line-number plugins, and site generators such as Hugo, MkDocs and Docusaurus expose a setting for them. GitHub does not render line numbers inside code blocks.
**How do I put a code block inside a list item?**
Indent the whole fenced block to line up with the text of the list item, usually by four spaces for a numbered list or two for a bullet, and keep a blank line before and after it. Without that indentation the fence ends the list and the block escapes to the top level.
---
## Markdown Comment Generator
URL: https://mdutil.com/tools/markdown-comments
### How do you write a comment in Markdown?
Markdown has no comment syntax of its own, so use an HTML comment: ``. Every major processor, including GitHub, GitLab and VS Code, keeps it in the source file and strips it from the rendered output. For a single line, the reference-style form `[//]: # (note)` works too.
```markdown
This paragraph is visible to readers.
```
The comment vanishes from the rendered page; only the paragraph is displayed. The note stays in the raw Markdown for anyone editing the file.
### Markdown comment syntax explained
Because CommonMark never defined a comment token, every method below is a workaround that exploits something the renderer already throws away. They differ in how widely they are supported and in how visible they are in the raw source.
#### HTML comments (recommended)
The most portable option by a wide margin. Markdown passes raw HTML through to the renderer, and the renderer discards comments. Works in GitHub, GitLab, VS Code, Obsidian, Jekyll, Hugo, Pandoc and virtually every static site generator.
```markdown
Install the CLI with npm.
```
Renders as: Install the CLI with npm. The comment produces no output at all.
#### Multi-line comments
The same delimiters span as many lines as you need. Keep a blank line between the closing `-->` and the following paragraph so the parser does not treat them as one block.
```markdown
## Getting started
```
Renders as: a Getting started heading. Every line inside the delimiters is hidden.
#### Commenting out a block of Markdown
Wrapping existing Markdown in an HTML comment hides it without deleting it — the usual answer to “how do I comment out a section”. The one rule: the hidden text must not contain a double hyphen, which would close the comment early.
```markdown
## Current pricing
```
Only the Current pricing heading is rendered. The legacy section stays in the file but is invisible to readers.
#### Reference-style comments
An unused link definition. The parser recognises the label, finds nothing referencing it, and outputs nothing. It must sit on its own line with a blank line before it, otherwise it is treated as ordinary paragraph text.
```markdown
[//]: # (Internal note: numbers come from the Q3 export)
Revenue grew 15% quarter over quarter.
[//]: # "Double quotes work as well"
```
Only the revenue sentence is rendered. Both definition lines disappear.
#### Empty link comments
A variation that points the definition at an empty destination. Functionally the same as the reference style; the label can be any unused string, which some teams use to tag the comment's author.
```markdown
[comment]: <> (Draft copy, do not publish)
[review-sarah]: <> (Check this claim against the changelog)
The API is backwards compatible.
```
Renders as: The API is backwards compatible. Both labelled notes are hidden.
#### Obsidian and MDX comments
Two ecosystems ship their own syntax. Obsidian hides anything between double percent signs. MDX v2 parses JSX, where HTML comments are a syntax error, so you need a JSX expression comment instead.
```markdown
%% Obsidian-only comment, single or multi-line %%
{/* MDX / Docusaurus comment */}
```
Each line is hidden in its own ecosystem, and printed literally in the other — neither is portable.
### Where Markdown comments work
Comment support tracks whether a platform allows raw HTML. Chat apps that strip HTML have no comment mechanism at all, so check this table before you rely on one.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub / GitLab | Full | is hidden in READMEs, issues, PRs and wikis. [//]: # also works. |
| VS Code | Full | Hidden in the Markdown preview. Ctrl+/ inserts around the selection. |
| Obsidian | Full | Supports HTML comments plus its own %% comment %% syntax. |
| Reddit | Partial | Raw HTML is disabled, so shows literally. Use [//]: # instead. |
| Discord / Slack | None | No comment syntax exists; the delimiters are posted as visible text. |
| Notion | None | Pasted comment syntax becomes plain text. Use Notion's own comment feature. |
| MDX / Docusaurus | Partial | MDX v2 rejects . Use the JSX form {/* comment */}. |
### How to add a comment in Markdown
1. **Choose a comment method** — Start with HTML comments unless you have a reason not to — they are the only form that works nearly everywhere.
2. **Write the note** — Type the reminder, TODO or reviewer note into the comment box. Line breaks are preserved for multi-line comments.
3. **Copy the Markdown** — Use the copy button to grab the generated syntax and paste it into your README, issue or documentation file.
4. **Confirm it is hidden** — Open the preview tab to verify the comment produces no visible output before you commit or publish.
### Frequently asked questions
**Does Markdown have a comment syntax?**
No. Neither the original Markdown specification nor CommonMark defines a comment. Every approach in use is a workaround: HTML comments rely on the renderer discarding them, and reference-style comments rely on an unused link definition producing no output.
**How do I comment out a section in Markdown?**
Wrap the section in an HTML comment: put on the line after it. The content stays in the file but is not rendered. Make sure the hidden text contains no double hyphen, because that can close the comment early in strict parsers.
**Are GitHub comments Markdown?**
Yes. Issue comments, pull request comments, review comments and discussions on GitHub are all written in GitHub Flavored Markdown, so headings, lists, tables, task lists and code fences all work. Hidden comments inside those boxes use the same syntax as READMEs.
**Can I write multi-line comments in Markdown?**
Yes, with HTML comments. Open with on its own line. Reference-style comments do not span lines; each line needs its own definition.
**Are Markdown comments visible in the source code?**
Yes. Comments are hidden only in the rendered output. Anyone who opens the raw file, views it on GitHub in raw mode, or clones the repository can read them. Never put credentials or confidential information in a Markdown comment.
**Which Markdown comment method has the best compatibility?**
HTML comments. They work in GitHub, GitLab, VS Code, Obsidian, Pandoc, Jekyll, Hugo and most other processors. Reference-style comments are the best fallback for platforms that strip raw HTML, such as Reddit. Obsidian's %% syntax and MDX's JSX comments are ecosystem-specific.
**Why is my reference-style comment showing up as text?**
Link definitions are only recognised at the start of a line with a blank line separating them from surrounding paragraphs. If [//]: # (note) is indented, or sits directly under a sentence, the parser reads it as ordinary text and prints it.
**Do comments work inside code blocks?**
No. Markdown deliberately does not process any syntax inside fenced code blocks or inline code spans, so the delimiters appear literally. To comment code that you are displaying, use the comment syntax of that language, such as two slashes for JavaScript or a hash for Python.
**How do I add a line break inside a Markdown comment?**
Just press Enter. Everything between is ignored by the renderer, so line breaks, indentation and blank lines inside the comment have no effect on the output and are purely for readability in the source.
**Do search engines see Markdown comments?**
No. The comment is removed when Markdown is compiled to HTML, so it never reaches the served page and crawlers cannot index it. An HTML comment written directly into a published HTML file is a different case: it is delivered to the browser, just not displayed.
---
## Markdown New Line Generator
URL: https://mdutil.com/tools/markdown-newline
### How do you add a new line in Markdown?
End the line with two spaces and press Enter — Markdown turns that into a single line break inside the same paragraph. A trailing backslash does the same thing in CommonMark and GitHub. For a new paragraph instead, leave one completely blank line between the two blocks of text.
```markdown
Roses are red.
Violets are blue.
This is a new paragraph.
```
The first two lines sit inside one paragraph separated by a
; the third becomes its own element.
### Every way to create a new line in Markdown
Markdown distinguishes a line break (same paragraph, tight spacing) from a paragraph break (new block, real spacing). There are four ways to get a newline, and each one fails in a different place.
#### Two trailing spaces (the standard line break)
End a line with exactly two spaces, then press Enter. Every CommonMark-compliant renderer turns that into a
inside the current paragraph. The spaces are invisible, which is the single most common reason a Markdown new line silently fails.
```markdown
Roses are red.
Violets are blue.
```
Two lines inside one paragraph. In HTML: Roses are red.
Violets are blue.
#### Backslash at the end of the line
A trailing backslash produces the same hard line break, and unlike spaces it is visible in your source and survives editors that trim whitespace on save. CommonMark, GitHub, GitLab, Pandoc and the VS Code preview all support it.
```markdown
Roses are red.\
Violets are blue.
```
Identical output to the two-space version, but the break is obvious when you read the raw Markdown.
#### Blank line for a new paragraph
One completely empty line closes the current paragraph and opens a new one. This is a paragraph break rather than a line break: you get a separate
element with real vertical spacing, and it works in every Markdown flavour without exception.
```markdown
This is the first paragraph.
This is a second paragraph.
```
Two separate
elements with a margin between them, instead of one paragraph split over two lines.
#### HTML
tag
Markdown lets raw HTML through, so
is the escape hatch when a formatter strips your trailing spaces or when the Markdown syntax simply cannot reach. Platforms that sanitise HTML, such as Discord, Slack and Reddit, ignore it.
```markdown
Line one.
Line two.
Line three.
```
Three lines inside one paragraph.
and
are equivalent; the self-closing form matters only in strict XHTML.
#### New line inside a table cell
A Markdown table row has to stay on one physical line, so pressing Enter inside a cell ends the row instead of breaking the text. The HTML tag is the only option here — trailing spaces and backslashes are swallowed by the table parser.
```markdown
| Step | Detail |
| --- | --- |
| Install | Run npm install
then restart the dev server |
```
The second cell shows “Run npm install” on one line and “then restart the dev server” on the next, inside a single cell.
#### Line break inside a list item
Trailing spaces work inside list items, but the continuation line must be indented to line up with the item text. Without that indentation the renderer closes the list and starts a new paragraph.
```markdown
- First bullet, first line.
First bullet, second line.
- Second bullet.
```
One bullet containing two lines, followed by a second bullet — rather than three separate items.
### Where each Markdown newline method works
The biggest surprise is that the same platform can behave differently in two places. GitHub renders a single Enter as a line break in comments but collapses it in a README, so always test the method where the content will actually live.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub issues & comments | Full | A single Enter already becomes a line break; two spaces are not needed. |
| GitHub README / .md files | Partial | Rendered as CommonMark, so a single newline is collapsed. Use two spaces, a backslash or
. |
| GitLab | Full | Two spaces, backslash and
all work in issues, MRs and repository files. |
| Discord | Partial | Shift+Enter inserts the break. Trailing spaces and HTML tags do nothing. |
| Slack | Partial | Shift+Enter only. Slack's mrkdwn has no trailing-space or
syntax. |
| Obsidian | Full | Single newlines break lines by default; enable Strict line breaks for CommonMark behaviour. |
| Notion | Partial | Shift+Enter breaks a line inside a block; trailing spaces are stripped on paste. |
| Reddit | Partial | A blank line is the reliable separator; HTML tags are removed by the sanitiser. |
| VS Code preview | Full | CommonMark by default; set markdown.preview.breaks to render single newlines as breaks. |
### How to add a new line in Markdown with this tool
1. **Choose a line break method** — Switch between trailing spaces, backslash, paragraph break and the HTML
tag using the tabs. Each tab loads a working example into the editor.
2. **Edit the example** — Type over the sample text. The two spaces or the backslash at the end of the line are what create the break, so keep them when you rewrite the sentence.
3. **Check the live preview** — The panel on the right renders your Markdown as you type, so you can confirm the newline lands where you expect before publishing.
4. **Copy the Markdown** — Use the copy button to put the exact syntax on your clipboard, invisible trailing spaces included.
### Frequently asked questions
**Why is my new line not working in Markdown?**
Almost always because the two trailing spaces were removed. Most editors and formatters trim trailing whitespace on save, and a lone Enter is collapsed into an ordinary space by CommonMark. Switch to a backslash at the end of the line, or an HTML
tag, if you need a break that survives auto-formatting.
**How many spaces do you need for a new line in Markdown?**
Exactly two spaces at the end of a line, followed by Enter. More than two also works in most renderers, but two is the specified minimum and the safest choice. Spaces on an otherwise empty line do nothing at all.
**What is the difference between a line break and a paragraph break in Markdown?**
A line break keeps the text in the same paragraph and compiles to a
element, so the lines sit tightly together. A paragraph break, made with one blank line, closes the paragraph and opens a new
with real vertical spacing. Use line breaks for addresses and poetry, paragraph breaks for separate ideas.
**Does pressing Enter once create a new line in Markdown?**
It depends on the renderer. Plain CommonMark treats a single newline as a soft break and collapses it into a space. GitHub comment boxes, GitLab, Discord, Obsidian and Notion turn hard breaks on, so one Enter is enough there. Rendered README files on GitHub do not.
**How do I add a new line inside a Markdown table cell?**
Use the HTML
tag. A table row must stay on one physical line, so a real newline would end the row instead of breaking the text. Trailing spaces and backslashes are consumed by the table parser and produce nothing.
**How do I add a line break inside a list item?**
End the line with two spaces and indent the continuation line so it aligns with the item text, usually by two or four spaces. Without that indentation the renderer closes the list and treats the following line as a new paragraph.
**How do I see trailing spaces in my editor?**
Turn on whitespace rendering. In VS Code set editor.renderWhitespace to all; Sublime Text, JetBrains IDEs and Vim have the same option under names like Show Whitespace or list. Also check that trim trailing whitespace on save is disabled for Markdown files.
**Can I use the HTML
tag in Markdown?**
Yes, in anything that renders Markdown to HTML, including GitHub, GitLab, Obsidian, Jekyll, Hugo and MkDocs. It is ignored on platforms that sanitise HTML, such as Discord, Slack and Reddit, where the tag either disappears or shows up as plain text.
**How do I add extra blank space between paragraphs in Markdown?**
Repeated blank lines are collapsed into one, so stacking them changes nothing. Put a line containing only between the paragraphs, or use two
tags in a row. On a documentation site a CSS class or spacer component is the cleaner fix.
**How do I add a new line in a GitHub README?**
README files are rendered as CommonMark, so a single Enter is collapsed. End the line with two spaces or a backslash, or insert
. This differs from GitHub issues and pull request comments, where a single Enter already produces a line break.
---
## Markdown Table Generator
URL: https://mdutil.com/tools/markdown-table-generator
### How do you create a table in Markdown?
A Markdown table is built from pipe characters and one row of dashes. Write the header cells between pipes, add a separator row of dashes beneath it, then list one row of data per line. Colons in the separator row set column alignment. GitHub, GitLab, Obsidian and most static site generators render it automatically.
```markdown
| Name | Role | Commits |
| :---- | :--------: | ------: |
| Ada | Engineer | 128 |
| Grace | Maintainer | 64 |
```
Renders a three-column table with Name left-aligned, Role centred and Commits right-aligned, and the first row styled as a bold header.
### Markdown table syntax explained
Tables come from GitHub Flavored Markdown rather than the original spec, so the rules are stricter than for most Markdown features. Two rows are mandatory — the header and the dashes underneath it — and every row must contain the same number of columns.
#### Basic table structure
Pipes divide the columns; a separator row of at least three dashes turns the first line into a header. The dashes do not have to line up with the text above them — the renderer only counts columns, so ragged raw source still produces a tidy table.
```markdown
| Package | Version | Status |
| --- | --- | --- |
| next | 16.0.1 | stable |
| react | 19.2.0 | stable |
```
Renders a three-column table with Package, Version and Status as bold header cells and two data rows beneath them.
#### Column alignment with colons
Colons in the separator row control how each column is aligned. Left is the default, so :--- and --- behave identically; centre and right need the extra colon. Right alignment is the convention for numeric columns.
```markdown
| Item | Qty | Price |
| :------- | :-: | -----: |
| Keyboard | 2 | 89.00 |
| Monitor | 1 | 249.50 |
```
Item stays left-aligned, Qty is centred and Price is right-aligned, so the decimal points line up down the column.
#### Escaping pipes inside a cell
A raw pipe splits the cell in two. Escape it with a backslash, or use the HTML entity | when the pipe sits inside inline code, where backslash escapes are not processed.
```markdown
| Command | Meaning |
| --- | --- |
| a \| b | a or b |
| `grep x | wc -l` | count matches |
```
Both rows keep exactly two columns; the pipe characters show up as literal text inside the cells instead of creating a third column.
#### Formatting and line breaks inside cells
Cells accept inline Markdown — bold, italic, links, images and inline code all work. Block-level content does not, so use a
tag when a cell needs a second line.
```markdown
| Option | Notes |
| --- | --- |
| `--watch` | **Recommended.**
Rebuilds on save. |
| `--quiet` | Hides progress output. |
```
The first Notes cell shows bold text with a second line underneath it; the option names render as inline code.
#### Tables without a header row
GitHub Flavored Markdown always requires the header and separator rows, but the header cells themselves may be left empty. Do that when the table is a layout grid rather than labelled data.
```markdown
| | |
| ----- | -------- |
| Ada | Engineer |
| Grace | Compiler |
```
Renders a two-column table with a visually blank header strip above two data rows. Most renderers still reserve the header row's height.
#### Merged cells via HTML
Markdown has no rowspan or colspan. When you genuinely need merged cells, drop an HTML table into the document — GitHub, GitLab and most static site generators render inline HTML inside Markdown files.
```markdown
| Environment |
|---|
| Node | 22.x |
| pnpm | 10.x |
```
Produces one header cell spanning both columns followed by normal two-column rows. Markdown syntax inside the HTML block is not processed.
### Where Markdown tables render
Because table syntax belongs to GitHub Flavored Markdown and not to CommonMark, support is excellent on developer platforms and effectively absent in chat apps.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub / GitLab | Full | Renders in READMEs, issues, pull requests, wikis and release notes, with all three alignments. |
| Obsidian | Full | Renders GFM tables and ships a built-in table editor that preserves alignment. |
| VS Code | Full | The built-in Markdown preview renders tables; a formatter extension keeps the raw pipes tidy. |
| Notion | Partial | Pasting table syntax creates a native Notion table; the raw pipes are not kept as text. |
| Reddit | Full | Supported in the Markdown editor; the rich-text editor builds tables from its toolbar instead. |
| Discord | None | Messages do not render tables. Wrap the table in a code block so the columns stay lined up. |
| Slack | None | No table syntax at all. Post the table as a code block, a snippet, or an image. |
### How to build a Markdown table with this generator
1. **Set the table size** — Enter how many rows and columns you need, then press Apply. Cell content you already typed is preserved whenever the grid grows.
2. **Fill in the cells** — Type straight into the grid. The top row is the header row and renders in bold once the table is published.
3. **Choose column alignment** — Use the L, C and R buttons under each header cell to align that column left, centre or right. The separator row updates as you click.
4. **Edit the raw Markdown (optional)** — Switch to the code editor to paste an existing table or hand-tune the syntax. Your edits are parsed straight back into the visual grid.
5. **Copy or export** — Copy the generated Markdown to the clipboard, or download it as a .md file that you can drop into a README.
### Frequently asked questions
**How do I create a table in Markdown?**
Write your header cells between pipe characters, put a separator row of dashes underneath, then add one data row per line. The smallest working example is | Name | Role | on the first line, | --- | --- | on the second, and | Ada | Engineer | on the third. The generator above assembles all of that for you.
**How do I align text in a Markdown table?**
Add colons to the separator row: :--- for left, :---: for centre and ---: for right. Left is the default, so plain --- and :--- render identically. Alignment is set per column and applies to the header cell as well as every data cell below it.
**Do Markdown tables work on GitHub?**
Yes. Tables are part of GitHub Flavored Markdown and render in README files, issues, pull requests, discussions, wikis and release notes. All three column alignments are supported, and cells accept inline formatting such as bold text, links and inline code.
**Can I create a Markdown table without a header?**
Not in standard GitHub Flavored Markdown, because the header and separator rows are both required. The usual workaround is to leave the header cells empty, which produces a blank strip above the data. For a genuinely header-free grid, use an HTML table instead.
**Can I merge cells in a Markdown table?**
No. Markdown tables have no equivalent of rowspan or colspan, and every row must contain the same number of columns. If you need merged cells, write an HTML table with colspan or rowspan attributes — GitHub and most static site generators render it inside a Markdown file.
**How do I convert CSV data into a Markdown table?**
Switch to the code editor, paste the CSV, then replace each comma with a pipe character and insert a row of dashes below the first line. The preview updates as you type, so a row that split incorrectly is obvious immediately. You can also load an existing .md or .txt file with the import button.
**Can I convert a Markdown table to Excel?**
Yes, indirectly. Replace the pipes with commas, delete the dashes row, and save the file with a .csv extension, which Excel and Google Sheets open directly. Selecting the rendered table in a browser preview and pasting it into a spreadsheet also keeps the column structure.
**Do Markdown tables work in Slack or Discord?**
Neither app renders them. Slack has no table syntax at all, and Discord ignores pipe tables in messages. The standard workaround is to wrap the table in a triple-backtick code block so the columns stay aligned in a monospaced font, or to share a screenshot instead.
**How do I make a table of contents in Markdown?**
List one link per heading and point each link at the heading's anchor, for example a bullet reading Installation linking to #installation. GitHub creates those anchors automatically by lowercasing the heading text and replacing spaces with hyphens. A single-column table works too if you want a boxed look.
**Why is my Markdown table not rendering?**
The three usual causes are a missing separator row of dashes under the header, rows that contain a different number of columns than the header, and a missing blank line before the table when it directly follows a paragraph. Unescaped pipe characters inside a cell also split that row into extra columns.
---
## Markdown Hyperlink Generator
URL: https://mdutil.com/tools/markdown-hyperlink-generator
### How do you create a hyperlink in Markdown?
Put the visible text in square brackets and the destination in parentheses directly after it: `[link text](https://example.com)`. Nothing may sit between the closing bracket and the opening parenthesis. Add a quoted title inside the parentheses for a hover tooltip. The same pattern accepts relative paths, #anchors and mailto: addresses.
```markdown
[MDUtil](https://mdutil.com)
[MDUtil](https://mdutil.com "Free Markdown tools")
```
Both lines render as a clickable link labelled MDUtil. The second also carries a title attribute, which most renderers show as a tooltip on hover.
### Markdown hyperlink syntax explained
Markdown has four link forms plus a handful of platform-specific rules. They all compile to an element, but they differ in where the URL lives and which renderers accept them.
#### Inline link (the standard form)
The everyday syntax: link text in square brackets, destination in parentheses, and an optional title in double quotes. A single space between the bracket and the parenthesis breaks it.
```markdown
Read the [CommonMark spec](https://commonmark.org "CommonMark 0.31") before arguing about edge cases.
```
Renders a sentence in which “CommonMark spec” links to commonmark.org and shows “CommonMark 0.31” on hover.
#### Autolink and bare URLs
Angle brackets turn a raw URL into a link whose text is the URL itself. GitHub Flavored Markdown also auto-links bare URLs, but strict CommonMark does not, so the angle brackets are the portable choice.
```markdown
```
The first line links to https://mdutil.com and displays the URL as its own text. The second becomes a mailto: link without you typing mailto:.
#### Reference-style link
Move the URL out of the sentence and replace it with a short label defined elsewhere in the file, usually at the bottom. Long paragraphs stay readable and one definition can serve many links.
```markdown
[CommonMark][spec] defines the syntax, and the [spec][] shortcut points at the same place.
[spec]: https://commonmark.org "CommonMark"
```
Both link texts resolve to commonmark.org. Labels are case-insensitive and the definition line never appears in the rendered output.
#### Anchor link to a heading
Link inside the same document with a fragment built from the heading: lowercase the text, swap spaces for hyphens and drop punctuation. GitHub, GitLab and most static site generators create these slugs for you.
```markdown
Jump to [Quick Setup](#quick-setup), or to a section of another file with [requirements](./install.md#requirements).
```
The first link scrolls to the “Quick Setup” heading on the same page; the second opens install.md and scrolls to its “Requirements” heading.
#### Image links and formatted link text
An exclamation mark in front turns the link into an image, and nesting an image inside a link makes the image clickable — the pattern behind every README badge. Emphasis markers belong inside the brackets.
```markdown
[](https://ci.example.com)
[**Bold link text**](https://mdutil.com)
```
Line one shows an image with alt text, line two is a badge that links to the CI dashboard, and line three is a link whose text is bold.
#### Discord and chat-app hyperlinks
Discord calls the inline form a masked link and renders it in ordinary messages as well as bot and webhook embeds. Angle brackets have a second meaning there: they suppress the preview card. Slack does not parse Markdown links at all.
```markdown
[Join the server](https://discord.gg/example)
```
In Discord the first line shows only “Join the server” as a clickable link; the second posts the plain URL with its preview embed suppressed.
### Where Markdown hyperlinks work
Inline links are universal, but reference links, relative paths and heading anchors are handled differently from one platform to the next.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub / GitLab | Full | Inline, reference, autolink and relative repo paths all work; heading anchors are generated automatically. |
| Discord | Partial | Masked links [text](url) render in messages and embeds. Reference links do not work; hides the preview. |
| Slack | Partial | The composer ignores [text](url). Slack's own format is . |
| Obsidian | Full | Standard Markdown links plus [[wiki links]] and ![[embeds]] for notes inside the vault. |
| Notion | Full | Typing [text](url) auto-converts, and pasting a URL onto selected text links it. |
| Reddit | Full | Inline and reference links both work in the Markdown editor on new and old Reddit. |
### How to create a hyperlink in Markdown
1. **Choose a link type** — Pick standard, automatic, reference or image depending on whether you need inline text, a bare URL, a reusable label or an embedded picture.
2. **Enter the text and URL** — Type the words readers should see, then paste the destination. Absolute URLs, relative paths, #anchors and mailto: addresses are all accepted.
3. **Add the optional extras** — Set a title to show a tooltip on hover, give reference links an ID, or switch on “open in new window” to add target and rel attributes to the HTML output.
4. **Copy the result** — Copy the generated Markdown, switch to the HTML tab if you need an tag, and open the preview tab to confirm the link points where you expect.
### Frequently asked questions
**How do I create a hyperlink in Markdown?**
Put the visible text in square brackets and the destination in parentheses immediately after it, like [Link text](https://example.com). There must be no space between the closing bracket and the opening parenthesis. To add a tooltip, place a quoted title inside the parentheses after the URL.
**How do I make a Markdown link open in a new tab?**
Markdown has no syntax for it. Use inline HTML instead: an tag with target="_blank" and rel="noopener noreferrer". Some renderers, such as MkDocs or markdown-it with the attrs plugin, let you append {target=_blank} to a normal link. Platforms that sanitise HTML, including GitHub READMEs, strip the attribute.
**What is the difference between standard and reference-style links?**
They render identically. A standard link keeps the URL inline, which suits one-off links. A reference link puts a short label in the sentence and defines the URL elsewhere in the file, which keeps paragraphs readable and lets you update a URL used in ten places by editing a single line.
**How do I link to a heading within the same document?**
Use a fragment built from the heading text: lowercase it, replace spaces with hyphens and remove punctuation, so “Quick Setup” becomes [Quick Setup](#quick-setup). GitHub, GitLab and most static site generators create these anchors automatically, and duplicate headings get a numeric suffix such as #quick-setup-1.
**How do I create an email link in Markdown?**
Write a normal link with a mailto: URL, for example [Email support](mailto:support@example.com). You can prefill a subject with a query string such as mailto:support@example.com?subject=Bug%20report. Wrapping a bare address in angle brackets also produces a mailto link automatically.
**How do I hyperlink in Discord?**
Discord supports masked links: [Click here](https://example.com) shows only the words and hides the URL. They work in normal messages and in bot or webhook embeds, but reference-style links do not work. To post a URL without the large preview card, wrap it in angle brackets.
**Can I use HTML for links inside Markdown?**
Yes in most renderers. An tag lets you set target, rel, class or id, which plain Markdown cannot express. The exceptions are platforms that sanitise or forbid HTML, such as Discord, Slack, Reddit comments and some static site configurations, where the tag is escaped or removed.
**Why is my Markdown link not working?**
The usual causes are a space between the closing bracket and the opening parenthesis, unencoded spaces or parentheses inside the URL, a missing scheme such as https://, or the link sitting inside a code block where formatting is ignored. Percent-encode spaces as %20, or wrap the URL in angle brackets inside the parentheses.
**How do I link to another Markdown file in the same repository?**
Use a relative path, for example [Installation](./docs/install.md). GitHub, GitLab and VS Code resolve relative links against the current file, so the link keeps working after the repository is cloned or the docs are moved together. Append a fragment such as ./docs/install.md#requirements to jump straight to a heading.
**How do I make an image a clickable link?**
Nest the image syntax inside a link: [](https://example.com). The outer brackets supply the destination and the inner exclamation-mark syntax supplies the image. This is how README badges link to build dashboards and package pages.
---
## Markdown Image Generator
URL: https://mdutil.com/tools/markdown-image-generator
### How do you change image size in Markdown?
Standard Markdown has no syntax for image size, so use an HTML tag instead: 
. GitHub, GitLab and most renderers pass that HTML straight through. Setting only the width keeps the original aspect ratio. To center the image, wrap the tag in a div with align="center".
```markdown
```
The first tag renders the image 300 pixels wide with the height scaled automatically; the second renders the same image centered on the page.
### Markdown image syntax, sizing and alignment
Inserting an image takes one line. Controlling how big it is and where it sits takes HTML, because CommonMark deliberately leaves presentation out of the spec. Here is every form you actually need.
#### Standard image syntax
An exclamation mark, alt text in square brackets, then the path in parentheses. The optional quoted title becomes a tooltip on hover.
```markdown
```
Renders the image at its natural size, falling back to “Alt text” if the file cannot be loaded.
#### Set the image size with an HTML tag
There is no width or height in Markdown itself, so switch to an ![]()
tag — almost every renderer, GitHub included, passes plain HTML through untouched. Give only a width and the browser scales the height for you.
```markdown
```
The first image is 300 pixels wide; the second fills half of its container and stays responsive. Both keep their original proportions.
#### Center, left or right align
Wrap the image in a div carrying an align attribute. This is the most portable technique because GitHub strips inline style attributes but keeps align. Keep a blank line inside the div if you want Markdown syntax to still be parsed there.
```markdown
```
Centers the image on the page. Swap center for left or right to push the image against that edge instead.
#### Make the image clickable
Nest the image inside link syntax to turn it into a thumbnail that opens a full-size version or another page. A clickable image that also needs a fixed size has to be written as nested HTML.
```markdown
[](https://example.com)
```
Both lines produce a clickable image, but only the HTML version can be constrained to 200 pixels wide.
#### Reference-style images
Move long URLs out of the prose and point at them by label. Useful when the same screenshot appears several times, or when the URL is a long CDN path that ruins readability.
```markdown
![Alt text][logo]
[logo]: /images/photo.png "Optional title"
```
Renders identically to the inline form. The definition line itself outputs nothing and can sit at the bottom of the file.
#### Editor-specific size shortcuts
Several editors invented their own sizing syntax. It is convenient locally but breaks on GitHub and most static site generators, so keep it out of anything you publish.
```markdown
![[photo.png|300]]
```
The first works in Typora and in markdown-it with the imsize plugin; the second is Obsidian's wiki-link form. GitHub prints both as literal text.
### Where image sizing and alignment work
Basic image syntax is universal. Sizing and alignment are not, because they depend on how much HTML each platform allows through its sanitizer.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub / GitLab | Full | ![]()
with width and height works, as does . Inline style attributes are stripped. |
| Obsidian | Full | Supports ![[photo.png|300]] and  shorthand as well as raw HTML. |
| VS Code preview | Full | Renders HTML img tags. The =300x200 shortcut is not recognised. |
| Notion | Partial | Pasted Markdown becomes an image block; you resize by dragging handles, not by syntax. |
| Reddit | Partial | No HTML allowed, so no sizing or alignment. Images are uploaded through the editor. |
| Discord | None | Image syntax is not rendered. Paste the raw URL and Discord embeds a preview itself. |
### How to size and align an image in Markdown
1. **Pick an image type** — Choose standard, reference-style or linked, depending on whether the image is inline, defined once by label, or should be clickable.
2. **Fill in the URL and alt text** — Paste the image URL or a relative path, then write alt text that describes the image for screen readers and for readers whose image fails to load.
3. **Set the size and alignment** — Enter a width, a height, or both, and choose center, left or right. The generator switches to the HTML form automatically, because plain Markdown cannot express size.
4. **Copy the result** — Copy the Markdown or the HTML output, and use the preview tab to confirm the image lands where you expect before you commit.
### Frequently asked questions
**How do I change image size in Markdown?**
Standard Markdown has no size syntax, so use an HTML tag:
. Setting only the width lets the browser scale the height and preserve the aspect ratio. Percentage widths such as 50% also work and stay responsive on narrow screens.
**How do I center an image in Markdown?**
Wrap it in a div with an align attribute:
, then the image tag, then
. This works on GitHub and GitLab because they keep the align attribute while removing inline CSS. In renderers that allow style attributes you can instead use style="display: block; margin: 0 auto".
**How do I resize an image in GitHub Markdown?**
GitHub accepts HTML inside Markdown, so an
![]()
tag with width and height renders correctly in READMEs, issues, pull requests and wikis. GitHub does not support the  shortcut and it strips style attributes, so always use the width and height attributes.
**How do I add an image in Markdown?**
Write an exclamation mark, the alt text in square brackets, and the path in parentheses: . Add a quoted title after the path for a hover tooltip. The path can be a full URL, a site-root path such as /images/photo.png, or a relative path.
**How do I add a local image in Markdown?**
Use a path relative to where the document is rendered rather than where it is stored: ./images/photo.png for the same folder, ../images/photo.png for the parent folder. On GitHub, relative paths resolve inside the repository, so images keep working in forks and in cloned copies.
**How do I make an image clickable in Markdown?**
Nest the image inside link syntax: [](https://example.com). The image becomes the link content. If the clickable image also needs a fixed size, write it as HTML instead: an anchor wrapping an img tag that carries the width attribute.
**How do I add a caption to an image in Markdown?**
There is no caption syntax. The usual solution is the HTML figure element: an img tag followed by a figcaption element, both inside figure. Most static site generators render that correctly. A fallback that works everywhere is a short italic line placed directly under the image.
**Why is my Markdown image not showing?**
The common causes are a wrong relative path, a private or hotlink-protected URL, a missing exclamation mark before the brackets, and a space between the closing bracket and the opening parenthesis. On GitHub, link to the raw file rather than the page that displays it.
**Does the  size syntax work?**
Only in some editors. Typora and markdown-it with the imsize plugin support it, but CommonMark, GitHub, GitLab and the built-in VS Code preview do not, and they print the syntax as literal text. Use an HTML img tag for any document that has to travel between tools.
**Does alt text actually matter?**
Yes. Alt text is what screen readers announce, what browsers display when an image fails to load, and one of the signals search engines use to understand the image. Describe the content rather than the file: Deployment pipeline diagram beats screenshot.png.
---
## Markdown Cheat Sheet
URL: https://mdutil.com/tools/markdown-cheatsheet
### What is the basic syntax of Markdown?
Markdown formats text with ordinary punctuation: # for headings, **text** for bold, *text* for italic, > for blockquotes, - or 1. for lists, backticks for code, [text](url) for links and  for images. Extended syntax adds tables, fenced code blocks, task lists, footnotes and strikethrough.
```markdown
# Heading 1
**bold** *italic* ~~strikethrough~~
> Blockquote
- Bullet item
1. Numbered item
- [ ] Task item
`inline code`
[link](https://example.com)
| Column A | Column B |
| -------- | -------- |
| Cell | Cell |
```
Renders an H1 heading, bold, italic and struck-through text, a quoted paragraph, a bulleted, a numbered and a checkbox list, inline code, a hyperlink, an image and a two-column table.
### Markdown syntax reference, element by element
Markdown splits into two layers. Basic syntax comes from John Gruber's original 2004 design and works in every parser. Extended syntax — tables, fenced code, task lists, footnotes — comes mostly from GitHub Flavored Markdown and CommonMark extensions, and support varies. The groups below cover both, along with the rules people most often get wrong.
#### Headings, paragraphs and line breaks
One to six hash characters set the heading level, and the space after the hashes is required. Paragraphs are separated by a blank line — a single newline is only a space in most parsers. To force a break inside a paragraph, end the line with two spaces or a backslash.
```markdown
# Heading 1
## Heading 2
###### Heading 6
First paragraph.
Second paragraph with a hard break
on the line above.
```
Produces h1, h2 and h6 elements, two separate paragraphs, and a
where the two trailing spaces appear.
#### Emphasis: bold, italic and strikethrough
One delimiter is italic, two are bold, three are both. Asterisks and underscores are interchangeable around whole words, but only asterisks work inside a word, because underscores appear in identifiers like snake_case. Strikethrough with double tildes is GFM, not core Markdown.
```markdown
*italic* and _italic_
**bold** and __bold__
***bold italic***
~~struck through~~
un**bel**ievable
```
Renders em, strong, nested strong+em, del, and bold applied to the middle of a single word.
#### Lists, nesting and task lists
Use -, * or + for bullets and any number followed by a dot for ordered lists; the renderer renumbers automatically, so 1. on every line is valid. Indent nested items by two to four spaces. A [ ] or [x] right after the bullet turns the item into a checkbox on GitHub-compatible platforms.
```markdown
- First item
- Second item
- Nested item
1. First step
1. Second step
1. Third step
- [x] Done
- [ ] Not done
```
Produces a bulleted list with one nested level, an ordered list numbered 1 to 3, and a task list with one checked box.
#### Links, images and reference style
Inline links put the text in brackets and the URL in parentheses; an image is the same with a leading exclamation mark, where the bracketed text becomes alt text. Reference style moves URLs to the bottom of the document, which keeps long paragraphs readable. Bare URLs autolink in GFM.
```markdown
[Inline link](https://example.com "Optional title")
[Reference link][docs]
[docs]: https://example.com/docs
```
Renders a titled hyperlink, an image with alt text, and a second hyperlink resolved from the definition at the bottom.
#### Inline code, fenced blocks and escaping
Single backticks mark inline code; if the code itself contains a backtick, wrap it in double backticks. Fenced blocks use three backticks with an optional language hint that drives syntax highlighting. Nothing inside code is parsed as Markdown, which makes it the simplest way to show literal symbols.
```markdown
Run `npm install` first.
Use ``a `b` c`` for nested backticks.
```js
function hello() {
console.log("Hello");
}
```
\*not italic\*
```
Renders two inline code spans, a JavaScript block with highlighting, and the literal text *not italic* with visible asterisks.
#### Tables, footnotes and other extended syntax
Tables need a header row and a dash row; colons in the dash row set alignment. Footnotes, definition lists, heading IDs, highlighting, subscript and superscript are extensions — useful in Obsidian or a documentation generator, but they fall back to raw characters where they are unsupported.
```markdown
| Left | Center | Right |
| :--- | :----: | ----: |
| a | b | c |
A claim that needs a source.[^1]
[^1]: The footnote text.
### Custom anchor {#custom-id}
```
Renders a three-column table with left, centre and right alignment, a superscript footnote marker linked to a note at the end, and an h3 with the id custom-id where heading IDs are supported.
### Which Markdown syntax works where
Basic syntax is safe everywhere. Extended syntax is where documents break: the same file can render perfectly in Obsidian and show raw symbols in a chat app. Check the target platform before you rely on anything below the Basic Syntax section.
| Platform | Support | Notes |
| --- | --- | --- |
| GitHub / GitLab | Basic + most extended | Tables, task lists, strikethrough, footnotes and autolinks. No definition lists, highlight or sub/superscript. |
| Discord | Partial | Headings, lists, quotes, code blocks, spoilers and masked links. No tables, images or footnotes. |
| Slack | Partial | Uses its own mrkdwn: *bold*, _italic_, ~strike~. No headings, tables or images. |
| Obsidian | Basic + extended | Adds ==highlight==, callouts, [[wikilinks]], footnotes and LaTeX math. |
| Notion | Partial | Typing basic syntax converts as you type. Footnotes, definition lists and heading IDs are dropped on paste. |
| Reddit | Partial | Tables, strikethrough and ^superscript^ work. No footnotes or heading IDs. |
| VS Code preview | Basic + extended | CommonMark plus GFM tables, task lists and math; extensions cover the rest. |
### How to use this Markdown cheat sheet
1. **Find the element** — Browse Basic Syntax for the elements every parser supports, or Extended Syntax for GitHub-era additions such as tables, footnotes and task lists.
2. **Compare code with output** — Each block shows the raw Markdown on the left and the live rendered result on the right, so you can confirm exactly what a symbol produces before using it.
3. **Copy the snippet** — Press the copy button in a block header to put that exact syntax on your clipboard.
4. **Paste and adapt** — Replace the placeholder text with your own. If you used extended syntax, check the compatibility table for your target platform first.
### Frequently asked questions
**What is Markdown?**
Markdown is a lightweight markup language that formats plain text using ordinary punctuation. John Gruber created it in 2004 so documents stay readable in their raw form. A parser converts the text to HTML, which is why the same .md file renders on GitHub, in Obsidian, in static site generators and in many chat apps.
**What is the difference between basic and extended Markdown syntax?**
Basic syntax covers the original elements: headings, paragraphs, bold, italic, blockquotes, lists, code, horizontal rules, links and images. Every parser supports them. Extended syntax, popularised by GitHub Flavored Markdown, adds tables, fenced code blocks, footnotes, definition lists, strikethrough, task lists, emoji and heading IDs, and support varies by platform.
**Is Markdown syntax the same on GitHub?**
GitHub uses GitHub Flavored Markdown, a superset of CommonMark. All basic syntax behaves identically, and GFM adds tables, task lists, strikethrough, footnotes, automatically linked URLs and syntax highlighting in fenced code blocks. GFM does not support definition lists, highlighting with equals signs, or subscript and superscript.
**How do I create a line break in Markdown?**
End the line with two spaces before pressing Enter, or end it with a backslash. Both force a break inside the same paragraph. A single newline on its own is treated as a space by most parsers, and a blank line starts a new paragraph rather than a line break.
**How do I make a table in Markdown?**
Write a header row with cells separated by pipes, then a row of dashes, then one line per data row. Colons in the dash row set alignment: :--- is left, :---: is centre and ---: is right. Tables are extended syntax, so they need a GitHub Flavored Markdown compatible parser.
**Can I use HTML inside Markdown?**
Usually yes. Inline tags such as kbd or sub work inside a paragraph, and block-level HTML works when it is surrounded by blank lines. Markdown syntax is normally not parsed inside block-level HTML, and platforms such as GitHub sanitise tags, so scripts and style attributes are stripped.
**How do I escape Markdown characters?**
Put a backslash in front of the character. Escaping works for the characters Markdown treats specially, including backslash, backtick, asterisk, underscore, curly braces, square brackets, parentheses, hash, plus, minus, dot, exclamation mark and pipe. Wrapping the text in backticks also disables formatting.
**Do I need a space after the hash in a Markdown heading?**
Yes. In CommonMark and GitHub Flavored Markdown, #Heading renders as literal text while # Heading renders as a heading. The same rule applies to other block markers: a list item needs a space after the dash and a blockquote needs a space after the angle bracket.
**What file extension do Markdown files use?**
The standard extension is .md, and .markdown is equally valid. Both are plain text, so any editor can open them. GitHub renders README.md automatically, and static site generators expect .md, or .mdx when the file also contains components.
**Why does my Markdown look different on another site?**
Platforms implement different feature sets. Highlighting, subscript, superscript, footnotes and definition lists are extensions rather than standard Markdown, so a page that renders correctly in Obsidian can show raw symbols on GitHub or Reddit. Stick to basic syntax when a document has to travel between tools.
---