Skip to content

Instantly share code, notes, and snippets.

@matthewzring
Last active November 13, 2024 18:15
Show Gist options
  • Save matthewzring/9f7bbfd102003963f9be7dbcf7d40e51 to your computer and use it in GitHub Desktop.
Save matthewzring/9f7bbfd102003963f9be7dbcf7d40e51 to your computer and use it in GitHub Desktop.
A guide to Markdown on Discord.

Markdown Text 101

Want to inject some flavor into your everyday text chat? You're in luck! Discord uses Markdown, a simple plain text formatting system that'll help you make your sentences stand out. Here's how to do it! Just add a few characters before & after your desired text to change your text! I'll show you some examples...

What this guide covers:

Text Formatting

Italics *italics* or _italics_

Underline italics __*underline italics*__

Bold **bold**

Underline bold __**underline bold**__

Bold Italics ***bold italics***

underline bold italics __***underline bold italics***__

Underline __underline__

Strikethrough ~~Strikethrough~~

Don't want to use markdown? You can slap a backslash in front of your statement, or put your message in a code block, and it'll escape the markdown formatting. You'll see those asterisks as you'd like!

Organizational Text Formatting

Headers

To create a header, you need to include a specific number of the hash/pound sign character (#). Use (#) for a big header, (##) for a smaller header, or (###) for an even smaller header as the first character(s) in a new line.

headers

Subtext

Like Headers, you can add subtext to any chat message. To do so, add a (-# ) before the text you want to appear in the subtext. Don’t forget the space after # and before your message.

subtext

Masked Links

You can use masked links to make text a clickable or pressable hyperlink. To do so, you need to include the text you want displayed in brackets and then the URL in parentheses. For example:

masked links

If you don't wish to embed a link, you can wrap the link with <> to remove the embed for that specific link.

Unordered Lists

You can create a bulleted list using either (-) or (*) in the beginning of each line. You can indent your list by adding a space before (-) or (*) at the beginning of each line.

unordered lists

Ordered Lists

To create an ordered list, add line items with numbers followed by periods. The numbers don't have to be in numerical order, but the list will always start with the first number. You can indent your list by adding a space before the number at the beginning of each line.

ordered lists

Code Blocks

Discord also supports code blocks as well. You can make your own code blocks by wrapping your text in backticks (`)

one line code blocks

You can also use three backticks (```) to create multiline code blocks, like this beautifully written haiku.

multiline code blocks

Block Quotes

The syntax to use Block Quotes is > or >>> followed by a space.

> at the beginning of a line of text, creates a single-line block quote.

one line block quote

>>> at the beginning of a line of text, creates a multi-line block quote. All text from >>> until the end of the message will be included in the quote.

multiline block quote

Spoiler Tags

You can manually tag spoilers by using the syntax || around your text or by typing /spoiler before your message. This is also negated by a code block.

spoiler tags

Syntax Highlighting

If you really want to spruce up your code blocks, you can denote a specific language for syntax highlighting, by typing the name of the language you want the code block to expect right after the first three backticks beginning your code block. An example...

syntax highlighting

There are many different languages in place of Markdown that Discord's syntax highlighting support. Each different language has its own approach to highlight-able syntax. Note that you won't be able to view syntax highlighting on the mobile app.

asciidoc

asciidoc

autohotkey

autohotkey

bash

bash

coffeescript

coffeescript

cpp (C++)

cpp

cs (C#)

cs

css

css

diff

diff

fix

fix

glsl

glsl

ini

ini

json

json

md (markdown)

md

ml

ml

prolog

prolog

ps

ps

py

py

tex

tex

xl

xl

xml

xml

yaml

yaml

And you get the idea! Now you're a Discord text markdown expert. Get out there and highlight your statements!

Acknowledgements

Discord
Discord Highlight.js

If you have any questions or want to get in contact with me, you can add matthewzring on Discord or join my discord server.

@serious-angel
Copy link

serious-angel commented Sep 16, 2024

it does

  • item 1item explanation
  • item 2

@Hashbrown777, I tried viewing the example in the Discord browser version stable 326257 (95c6a53) in Google Chrome 128.0.6613.137 (rev. fe621c5aa2d6b987e964fb1b5066833da5fb613d), and it looks like the following, where the result visually matches the CommonMark behavior but does not match its DOM:

Screenshot_20240916_150640

I.e. In CommonMark, it would be:

<ul>
<li>
<p>item 1</p>
<p>item explanation</p>
</li>
<li>
<p>item 2</p>
</li>
</ul>

At Discord, it's:

<ul><li><span><span>item 1
item explanation</span></span></li><li><span><span>item 2</span></span></li></ul>

The reason the indentation in Discord works inside a singular <span> in certain clients is the following:

.markup_abc123 li {
    white-space: break-spaces;
}

Some clients may currently not support the CSS property value (i.e. CanIUse, and therefore are you sure the client in your environment does?

@Hashbrown777
Copy link

I'm using discord..

@God-damnit-all
Copy link

I made a website that shows all the possible languages: https://discord-syntax-highlighting.vercel.app

(source: https://github.com/cherryblossom000/discord-syntax-highlighting)

This is great, but I wish you could input your own text. I know there's a highlight.js demo, but it doesn't match with Discord's color scheme.

@I-am-TURBO
Copy link

A headsup, discord is working on adding a syntax for small text formatting using -# text

It's not yet out from what I've seen, but it's planned.

1000184751

@serious-angel
Copy link

serious-angel commented Oct 13, 2024

under mentions you might wanna add: <id:home>, <id:browse> & <id:customize>:

@I-am-TURBO , please consider stating the suggestion in the GitHUb repo Issues instead, to also keep it for the future in more organized form ^^

@I-am-TURBO
Copy link

under mentions you might wanna add: <id:home>, <id:browse> & <id:customize>:

@I-am-TURBO , please consider stating the suggestion in the GitHUb repo Issues instead, to also keep it for the future in more organized form ^^

ya know.... I should have thought of that. thanks for this!

@artshade i did as you suggested.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment