Discord Text Formatting Guide: Colors, Bold, Italic, Strikethrough

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…

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, and it’ll escape the markdown formatting. You’ll see those asterisks as you’d like! Just keep in mind, it doesn’t work in messages with edits or underscores.

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

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

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…

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. For a full list: https://highlightjs.org/static/demo/. Note that you won’t be able to view syntax highlighting on the mobile app.

asciidoc

autohotkey

bash

coffeescript

cpp (C++)

cs (C#)

css

diff

fix

glsl

ini

json

md (markdown)

ml

prolog

py

tex

xl

xml

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

Hammer and ChiselDiscord Highlight.js

A special thanks to Frosty#9449 for their help in making this guide.

If you have any questions or want to get in contact with me, you can add Matthew#2334
on Discord or join my support server.

Last Updated 8/16/2019: We included an extra “Markdown Text 101” section with three awesome resources to take your Markdown knowledge even further. You’ll also find a new section on chat formatting when using international keyboard layouts.
Added several “quality of life” updates to this guide.

From humble beginnings on Discord…

I was a complete newbie back then when I joined my first Discord channel.

People were typing in underlines, bolded letters, strikethrough text, italics, and even colors! “How in the world do people type in colors?!”, I thought.

I tried to type “/bold hello guys!”, but that obviously didn’t work. It just made it obvious I had no clue what I was doing.

You
Can Learn Awesome Discord Formatting


If you’re reading this, you’ve probably been that guy or gal (or you’re trying to avoid all the disappointment and become a Discord formatting wiz!)

DISCORD FORMATTING GUIDE PDF:

Click here to get a PDF copy of this guide that transfers over to your smartphone, tablet, laptop, or any other media!

Either way, today I’m going to show you how to type out literally every single format Discord offers.

You’ll learn the basics behind Discord’s formatting engine (Markdown & Highlight.js), basic formatting commands (bolding, italicizing, underlining, etc.), and you’ll learn how to type out text in boxes and code blocks — in color!

Save This Page as a Reference

Once you have the basics down Discord formatting isn’t too bad.

While you’re still learning the commands though, it may be a good idea to keep this page open for reference (or bookmarked).

Anyways, enough talk — let’s get formatting!

Behind the Scenes: Discord’s Text Formatting Engine

While we sit there chatting away on Discord day after day, there’s a sleek, lightweight engine working in the background, formatting all of our text.

This “engine” is called Markdown.

The Rundown on Markdown

Originally created in 2004 by John Gruber and Aaron Swartz, Markdown is a markup language designed to be lightweight and simple to read/write. It’s completely text-based and uses cleverly placed symbols to format words in bold, italics, underlined, etc.

Although it’s been most commonly used to format readme files, forum discussions, and to turn plain text into rich text in basic text editors, Discord’s developers saw its potential and brought it into the core software.

We’re going to dig into Discord Markdown in the next section so you can learn how to properly format all of your messages in any way you’d like.

Highlight.js Makes Color Possible

Before we dig into markdown I wanted to explain another neat feature the Discord developers added on. It’s a library called Highlight.js.

Now, I want to make it clear that Discord doesn’t have true full-text highlighting. You can’t say, “I want this word to be in red, and this one to be in blue!”. That kind of highlighting doesn’t exist.

What does
 exist for our text-coloring purposes, though, is a “hacked” version of text highlighting using syntax coloring methods from highlight.js.

Even though we can’t directly highlight text, we can
 create a code block in discord, point it towards a specific syntax highlighting profile included in highlight.js, and then use that to our advantage by wrapping our text in the appropriate symbols.

This will all make much more sense when we get to some juicy examples down below.

Remember This Going Forward

You don’t have to remember all those nitty-gritty details. For now, all you have to know is that Discord uses Markdown for its text formatting
, and Highlight.js for code block highlighting
.

How to Format Text in Discord

And now the fun begins. I’m going to show you how to bold, italicize, underline, and strikethrough text as a starting point.

We’ll start with the basics, and then move on into creating code blocks for text coloring.

How to Bold Text in Discord

To create bolded text in discord, all you have to do is start and end the bolded text with two asterisks (*).

The asterisk is SHIFT+8
 on your keyboard.

If you look at the image below, you’ll notice that I put two asterisks, or stars, in front of and after the text I wanted to be in bold.

Here’s what I typed and the result it produced:

Here’s an example of **bolded text**

How to Italicize Text (Create Slanted Italics) in Discord

To create italics or italicized text in Discord, you have to type the asterisk once again, but this time use only one asterisk
.

To bold text, we used two asterisks, like this: **bold text**

For italics, we would do the same thing but with one single asterisk: *italicized text*

Again, the asterisk (star) is SHIFT+8
 on your keyboard.

Here’s what I typed to get the result shown in the image below:

Here’s an example of *italicized text*

How to Create Bold Italicized Text in Discord (Bold + Italics)

You might’ve been able to guess the markdown for Bold + Italics by now…

Instead of only one or two asterisks, it’s three asterisks
.

Here’s an example of ***bold italicized text***

How to Underline Text in Discord

To format our text as underlined, we need two use two underscores (__)

This is meant to be a thorough guide, so I’m including the keyboard layout for an underscore below (in case you’re reading this and have never yet had to type an underscore before!):

I typed this to get the result below:

Here’s an example of __underlined text__

How to Create Strikethrough Text in Discord

For strikethrough text, we need to use the tilde (~) key.

Two tildes cross out, or ‘strike through’, the text you type.

Here’s the keyboard layout (yellow highlighted keys) for typing a tilde. You have to hit SHIFT + ~
.

Here’s what I typed below:

Here’s an example of ~~crossed out~~ text

Formatting on International Keyboard Layouts

A reader recently pointed out that international keyboard layouts should be considered as well. Here we make the assumption of the asterisk being “Shift + 8” and the tilde being “Shift + Backtick (`)”, but this isn’t always the case.

Here are some additional keyboard layouts that international users might encounter, and an example of where the asterisk would be on each of these layouts.

German:
Shift+[+] (key right of Ü)Spanish:
Shift+[+] (key right of `^ (Spain) or ´¨ (Latin America))French (France):
* (key right of ù%)French (Belgium):
Shift+$ (key right of ^¨)French (Switzerland):
Shift+3Italian:
Shift+[+] (key right of èé)Swedish:
Shift+’ (key right of Ä)

If you find yourself using one of these alternative keyboard layouts, feel free to adjust accordingly. 

A vast majority of users typically use the standard English keyboard (which is why we accommodated it by default), but we wanted to acknowledge alternative layouts and that all of this can be done no matter what
your layout is.

Combining Text Formatting Options Even Further

We can also combine the underline into bold, italics, and bold+italics.

Here’s an example:

Underlined and Italicized Text

__*underlined and italicized text*__

Underlined and Bolded Text

__**underlined and bolded text**__

Underlined, Italicized, and Bolded Text

__***underlined, italicized, and bolded text***__

How to ‘Escape’ Text and See All Your Underscores and Asterisks

In case you actually want
 to see your underscores or asterisks in a message (like in an emoji, for example), you can use the backslash ‘’ key to skip markdown formatting and show the text just like it is.

Take a peek at the example below (notice the backslashes ‘’ at the beginning of each character).

The excessive backslashes
are needed here because I have underscores in my message.

__***I want this to be shown in its full glory!***___

But notice that the backslashes at the end actually aren’t required
 if you have them all in the beginning:

If I didn’t have underscores, a single backslash ‘’ would do:

**starred message with no underscores!**

That Concludes Basic Formatting

And that’s it for basic formatting. It’s pretty simple stuff, and you should have it down after a few messages.

The only keys you have to remember are Underscores, Asterisks (Stars), and Backslashes.

Advanced Text Formatting in Discord: Writing in Color

And now we get to the fun part… formatting our discord messages in color!

Once you start getting some colorful messages out there in the channels you frequently visit, you’ll start getting asked how it’s done.

We’re going to cover some basics (code blocks), and then jump right into coloring your messages! Let’s get to it!

Single Line Code Blocks in Discord

To create a single line code block in discord, you need to use the ‘tick’ or ‘backtick’ character: `.

Since this key can be a difficult key to find if you’ve never had to use it before (up until this point), I included a nice highlighted keyboard layout diagram below:

The ‘tick’ or ‘backtick’ character should be in the upper left corner of your keyboard
 right under the escape (ESC) key.

Once you’re familiar with the ‘backtick’ key, let’s create a single line code block. All you have to do is put a single backtick
 before and after your text.

Here’s what I wrote for the example below:

`This is an example of a single line code block`

Multiple Line (Multiline) Code Blocks in Discord

Just like the single line code block, multi-line code blocks also use the backtick (“`) character. The only difference is, instead of writing a single backtick (`) you have to write three (“`) before and after your text.

The neat thing here is that you can press enter and space your text across multiple lines, all formatted in a single multi-line code block.

Here’s the markdown for the example below:

```Experimenting with … … Multiple lines… … For my code blocks!```

You’ll notice in the image above that we have all of our text in a code block, but this time it’s
in multiple lines just like we wanted.

How to Format Colored Text in Discord

And now the moment we’ve all been waiting for… [drumroll]
… Colored Text!

I was searching around the web for a good example of some colored text formatting in Discord, but couldn’t find anything clear.

There were some examples, but they were pretty hazy. I couldn’t find a single guide that clearly
 showed you how to format your text if you wanted it to be in a certain color.

We’re Essentially Hacking Syntax Highlighting

As I mentioned in the intro, what we’re going to be doing here is ‘hacking’ or ‘hijacking’ syntax highlighting from Highlight.js running in the background in Discord.

We have to do this because, as of writing this, Discord doesn’t have built-in text highlighting functions.

As a result, we’ll have to do a little bit of a workaround — but as long as it works, it works!

Here’s How Text Coloring in Discord Works

Since we’ll be using a workaround based on Highlight.js, here’s how it’s going to work.

We will be creating multiline code blocks using three backticks and specifying the syntax highlighting language.

We can do this by including the highlighting programming language reference right at the beginning of the multiline code block.

Just like this, for example. Here we are specifying ‘Apache’ as the syntax highlighting language:

```apache Some text goes here... ```

We’ll be “exploiting” some syntax highlighting and using it to our advantage for coloring some text.

I included most of the colors you’d expect to use below, and tried to show the differences between various language references.

Limitations to this Text Coloring Method

There are (unfortunately) limitations to this method. The most common limitation being, your text has to be connected in one word in some

referenced syntax highlighting languages (not all!). 

This means you can’t type: This is a sentence.

You’ll have to type: This_is_a_sentence OR Thisisasentence.

Why is this? Well, since we’re exploiting syntax highlighting to highlight our Discord messages, we’re basically trying to make the multiline code block think that our message is literal programming code.

Most of the time the colors we want are contained in variables, which by definition, can’t contain any spaces.

One place this does

work well is in code comments 
and strings.
 I tried to include code comments and strings in each of the colors below as frequently as possible (to make it easy to type out).

If you look closely, you’ll notice I did include some variables and mentioned that you can’t have spaces if you choose to use those formatting methods. Even then, this may still be a perfectly
viable method for single words.

Anyways, that’s enough yapping from me — let’s get coloring!

How to Color Text RED in Discord

Diff Syntax Highlighting for Red (EASY)

Include dashes (-) before the line you want red colored text.

```diff - Here's some red colored text! ```

CSS Syntax Highlighting for Orange (Red-Orange)

Include brackets [ ] around the text you want highlighted. 

```css [RED Colored Text in CSS Highlighting] ```

How to Color Text YELLOW in Discord

Fix Syntax Highlighting for Yellow (EASY)

In Fix, everything you type is yellow by default! This is a great, easy way to have yellow text. 

```fix Everything is yellow in fix -- No matter the line!  ```

Apache Syntax Highlighting for Yellow (Limitation: NO SPACES)

Include a percent sign and right curly brace, %{, at the beginning of your text, and a left curly brace, }, at the end to highlight your text yellow in Apache syntax.

```apache %{Dark_YELLOW_Colored_Text} ```

How to Color Text GREEN in Discord

Diff Syntax Highlighting for Light Green (EASY)

Include a plus sign (+) before the line that you want turned green. 

```diff + Here's some green colored text! ```

CSS Syntax Highlighting for Light Green

Include quotation marks ” ” around the text you want colored Light Green.

```css "Here's some nice LIGHT GREEN colored text" ```

Bash Syntax Highlighting for Dark Green (EASY)

Quotation marks around your text ” “

```bash "Here's some nice, dark green text" ```

Note: 
This dark green color and quotation marks around your text also works
in a bunch of other reference languages, not only “bash”. It works with “coffeescript
”, “cpp
”, and many more.

JSON Syntax Highlighting for Dark Green (EASY)

Just like in Bash, quotation marks around the text you want to color dark green. 

```json "Green colored text in JSON" ```

How to Color Text BLUE in Discord

INI Syntax Highlighting for Blue

Place brackets [ ] around the text you want highlighted blue.

```ini [Here's some blue highlighted text] ```

CSS Syntax Highlighting (Limitation: NO SPACES)

Put a single dot (.) in front of the text you want colored blue, and make sure you don’t have any spaces in the line.

```css .dark_BLUE_text_without_spaces ```

Color Formatting Takeaways

As you’ve probably noticed, there are limitations to using this method (such as having to type no spaces for certain colors).

But the most important thing is, we can still color our text relatively easily!

I’d recommend using the DIFF, BASH, FIX, and CSS highlighting above (for red, green, yellow, and blue respectively).

Either way, the examples above include several shades of the primary syntax highlighting colors, and let you experiment with them in your messages.

Markdown Text 101: Digging Deeper

If you want to dig into Discord Markdown even further and learn some more tips/tricks, then these are a few very
helpful resources you can’t miss. 

The Markdown Tutorial

My favorite Markdown learning resource is very simply titled “The Markdown Tutorial”.
It walks you through Markdown step by step with both instructions and
live output of what your text will look like. This is a neat learning tool that I’d definitely recommend diving into for some deeper learning. 

The Markdown Cheatsheet

Once you’ve gone through some markdown tutorials and just want a quick reference to look back on, there’s this awesome Markdown Cheatsheet
that lists every single type of formatting you’d encounter. 

The Official Discord Markdown Guide

And finally, there’s the Official Markdown Guide from the Discord Team
(it’s on the discordapp.com website). It covers everything we talked about in this guide (with regards to chat formatting), but it doesn’t go into as much detail about how
we actually get each type of color. It can still be a very useful reference if you’re looking for a quick refresher. 

Now It’s Your Turn

And now the ball is in your court — get out there and format/color some text!

Don’t forget to bookmark this page as a resource for future use. Good luck, and have fun!

Discord Bot From Scratch

Learn how to make a Discord Bot from the ground up by watching our free video course (nearly 2 hrs of video
)!

—>

# Heading 1 ## Heading 2 ### Heading 3 #### Heading 4 ##### Heading 5 ###### Heading 6  ## Horizontal Rules  -----  _____  *****  ## Emphasis  **This is bold text**  __This is bold text__  *This is italic text*  _This is italic text_  ~~Strikethrough~~  ## Tables  |Trial|Result| |-----|------| |1|Fail| |2|Fail| |3|Success|  Right aligned columns  |Trial|Result| |------:|-----------:| |1|Fail| |2|Fail| |3|Success|  ## Lists  - Unordered - Create a list by starting a line with `+`, `-`, or `*` - list - With nesting too - end  1. Ordered 2. list 1. With nesting  Start numbering with offset:  57. foo 1. bar  ## Typographic replacements  (c) (C) (r) (R) (tm) (TM) (p) (P) +-  test.. test... test..... test?..... test!....  !!!!!! ???? ,,  -- ---  ## Blockquotes  > Blockquotes can also be nested... >> ...by using additional greater-than signs right next to each other... > > > ...or with spaces between arrows.  ## Code  Inline `code`  Indented code  // Some comments line 1 of code line 2 of code line 3 of code   Block code "fences"  ``` Sample text here... ```  Syntax highlighting  ```js var foo = function (bar) { return bar++; };  console.log(foo(5)); ```  ## Links  [link text](https://bots.ondiscord.xyz)  [link with title](https://bots.ondiscord.xyz "title text!")  Auto-converted link https://bots.ondiscord.xyz  ## Images  ![Discord Logo](https://totalmessengers.ru/wp-content/uploads/2019/12/pp_image_18229_o2doa4cgwtfc0b01fe10a0b8c602fb0106d8189d9b.png) ![No text logo](https://totalmessengers.ru/wp-content/uploads/2019/12/pp_image_18230_jesscixa8t2c21aeda16de354ba5334551a883b481.png "Discord")  Like links, Images also have a footnote style syntax  ![Alt text][d-logo]  [d-logo]: https://totalmessengers.ru/wp-content/uploads/2019/12/pp_image_18229_o2doa4cgwtfc0b01fe10a0b8c602fb0106d8189d9b.png  "Discord Logo"  Images with a specific size:  ![Discord Logo](https://totalmessengers.ru/wp-content/uploads/2019/12/pp_image_18229_o2doa4cgwtfc0b01fe10a0b8c602fb0106d8189d9b.png =200x100)  ## Emoji  > Classic markup: :thinking: :tada: :laughing: :star: > > Shortcuts (emoticons): :-) :-( 8-) ;)  See a full list here: [Full emoji list (big)](https://github.com/markdown-it/markdown-it-emoji/blob/master/lib/data/full.json)  ##   Here's some ==marked text==  ## Abbreviations  This is an HTML abbreviation example.  It converts "HTML", but keeps intact partial entries like "xxxHTMLyyy" and so on.  *[HTML]: Hyper Text Markup Language  ## Keyboard  Press [[Shift]]+[[A]] to open  ## Attributes  Add class to element {.tag .is-info}  Add styles to **element**{}  Add data attribute to element: ==Inspect this in your dev tools=={data-marked}  ## Heading Anchors  [This will take you to the Links section](#links)  ## Containers  ::: block This is a **default** container. It allows you to create divs for styling.  Just create a style for `.block.default` :::  ::: info This is an **info** container.  It contains normal markdown like [link](https://bots.ondiscord.xyz), `code`, [[kbd]], and ==mark==.  ```js console.log('test') ```  1. Lists 2. too :::  ::: success This is a **success** container.  It contains normal markdown like [link](https://bots.ondiscord.xyz), `code`, [[kbd]], and ==mark==.  ```js console.log('test') ```  1. Lists 2. too :::  ::: warning This is a **warning** container.  It contains normal markdown like [link](https://bots.ondiscord.xyz), `code`, [[kbd]], and ==mark==.  ```js console.log('test') ```  1. Lists 2. too :::  ::: danger This is a **danger** container.  It contains normal markdown like [link](https://bots.ondiscord.xyz), `code`, [[kbd]], and ==mark==.  ```js console.log('test') ```  1. Lists 2. too :::  ::: question How do containers work?  This is a **question** container. You can use it for frequently asked questions or something.  To change the label for your container just type the markdown text after the container type. :::  ::: spoiler Click to reveal spoiler This is a **spoiler!**  A spoiler is a special type of block that is initially hidden. :::

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Horizontal Rules

Emphasis

This is bold text

This is bold text

This is italic text

This is italic text

Strikethrough

Tables

Trial Result
1 Fail
2 Fail
3 Success

Right aligned columns

Trial Result
1 Fail
2 Fail
3 Success

Lists

  • Unordered
  • Create a list by starting a line with +
    , -
    , or *
  • list
    • With nesting too
  • end
  1. Ordered
  2. list
    1. With nesting

Start numbering with offset:

  1. foo
  2. bar

Typographic replacements

© © ® ® ™ ™ § § ±

test… test… test… test?.. test!..

!!! ??? , – —

Blockquotes

Blockquotes can also be nested…

…by using additional greater-than signs right next to each other…

…or with spaces between arrows.

Code

Inline code

Indented code

// Some comments line 1 of code line 2 of code line 3 of code 

Block code «fences»

Sample text here... 

Syntax highlighting

var
 foo = function
 (bar
) 
{ return
 bar++; };  console
.log(foo(5
)); 

Links

link text

link with title

Auto-converted link https://bots.ondiscord.xyz

Images

Like links, Images also have a footnote style syntax

Images with a specific size:

Emoji

Classic markup: 🤔 🎉 😆 ⭐️

Shortcuts (emoticons): 😃 😦 😎 😉

See a full list here: Full emoji list (big)

Here’s some marked text

Abbreviations

This is an HTML
abbreviation example.

It converts «HTML
«, but keeps intact partial entries like «xxxHTMLyyy» and so on.

Keyboard

Press Shift
+A
to open

Attributes

Add styles to element

Add data attribute to element: Inspect this in your dev tools

Heading Anchors

This will take you to the Links section

Containers

This is a default
container. It allows you to create divs for styling.

Just create a style for .block.default

This is an info
container.

It contains normal markdown like link, code
, kbd
, and mark
.

console
.log('test'
) 
  1. Lists
  2. too

This is a success
container.

It contains normal markdown like link, code
, kbd
, and mark
.

console
.log('test'
) 
  1. Lists
  2. too

This is a warning
container.

It contains normal markdown like link, code
, kbd
, and mark
.

console
.log('test'
) 
  1. Lists
  2. too

This is a danger
container.

It contains normal markdown like link, code
, kbd
, and mark
.

console
.log('test'
) 
  1. Lists
  2. too

This is a question
container. You can use it for frequently asked questions or something.

To change the label for your container just type the markdown text after the container type.

This is a spoiler!

A spoiler is a special type of block that is initially hidden.

Рейтинг автора
5
Подборку подготовил
Андрей Ульянов
Наш эксперт
Написано статей
168
Ссылка на основную публикацию
Похожие публикации