Skip to content

Instantly share code, notes, and snippets.

@kkrypt0nn
Last active June 19, 2024 04:48
Show Gist options
  • Save kkrypt0nn/a02506f3712ff2d1c8ca7c9e0aed7c06 to your computer and use it in GitHub Desktop.
Save kkrypt0nn/a02506f3712ff2d1c8ca7c9e0aed7c06 to your computer and use it in GitHub Desktop.
A guide to ANSI on Discord

A guide to ANSI on Discord

Discord is now slowly rolling out the ability to send colored messages within code blocks. It uses the ANSI color codes, so if you've tried to print colored text in your terminal or console with Python or other languages then it will be easy for you.

Quick Explanation

To be able to send a colored text, you need to use the ansi language for your code block and provide a prefix of this format before writing your text:

\u001b[{format};{color}m

\u001b is the unicode escape for ESCAPE/ESC, meant to be used in the source of your bot (see http://www.unicode-symbol.com/u/001B.html). If you wish to send colored text without using your bot you need to copy the character from the website.

After you've written this, you can now type the text you wish to color. If you want to reset the color back to normal, then you need to use the \u001b[0m prefix again.

Formats

Here is the list of values you can use to replace {format}

  • 0: Normal
  • 1: Bold
  • 4: Underline

Colors

Here is the list of values you can use to replace {color}:

Text Colors

  • 30: Gray
  • 31: Red
  • 32: Green
  • 33: Yellow
  • 34: Blue
  • 35: Pink
  • 36: Cyan
  • 37: White

Background Colors

  • 40: Firefly dark blue
  • 41: Orange
  • 42: Marble blue
  • 43: Greyish turquoise
  • 44: Gray
  • 45: Indigo
  • 46: Light gray
  • 47: White

Example

Let's take an example, I want a bold green colored text with the firefly dark blue background. I simply use \u001b[0;40m (background color) and \u001b[1;32m (text color) as prefix. Note that the order is important, first you give the background color and then the text color.

Alternatively you can also directly combine them into a single prefix like the following: \u001b[1;40;32m and you can also use multiple values. Something like \u001b[1;40;4;32m would underline the text, make it bold, make it green and have a dark blue background.

Result:

Background and text color

Raw message used:

```ansi
\u001b[0;40m\u001b[1;32mThat's some cool formatted text right?\u001b[0m
or
\u001b[1;40;32mThat's some cool formatted text right?\u001b[0m
```

ANSI Colors Showcase

The way the colors and different formats look like on Discord is shown here

ANSI Colors

Disclaimer

Note: The change has been brought to all stable desktop clients. Since syntax highlighting on mobile is far behind, ANSI is not supported on mobile as well. Refer to this gist for other syntax highlighting methods.

ANSI Colors Showcase

This is a small gist to show how I've made the picture showcasing the different ANSI formats above.

The \u001b is the unicode for ESCAPE/ESC, see http://www.unicode-symbol.com/u/001B.html. If you want to use it yourself without bots, then you need to copy paste the character from the website.


Example

\u001b[1;40;32mThat's some cool formatted text, right?

Color Names

\u001b[0;30mGray\u001b[0;0m
\u001b[0;31mRed\u001b[0;0m
\u001b[0;32mGreen\u001b[0;0m
\u001b[0;33mYellow\u001b[0;0m
\u001b[0;34mBlue\u001b[0;0m
\u001b[0;35mPink\u001b[0;0m
\u001b[0;36mCyan\u001b[0;0m
\u001b[0;37mWhite\u001b[0;0m
\u001b[0;40mFirefly dark blue background\u001b[0;0m
\u001b[0;41mOrange background\u001b[0;0m
\u001b[0;42mMarble blue background\u001b[0;0m
\u001b[0;43mGreyish turquoise background\u001b[0;0m
\u001b[0;44mGray background\u001b[0;0m
\u001b[0;45mIndigo background\u001b[0;0m
\u001b[0;46mLight gray background\u001b[0;0m
\u001b[0;47mWhite background\u001b[0;0m

Colors

\u001b[0;30mExample\u001b[0;0m \u001b[0;31mExample\u001b[0;0m \u001b[0;32mExample\u001b[0;0m \u001b[0;33mExample\u001b[0;0m \u001b[0;34mExample\u001b[0;0m \u001b[0;35mExample\u001b[0;0m \u001b[0;36mExample\u001b[0;0m \u001b[0;37mExample\u001b[0;0m

Backgrounds

\u001b[0;40mExample\u001b[0;0m \u001b[0;41mExample\u001b[0;0m \u001b[0;42mExample\u001b[0;0m \u001b[0;43mExample\u001b[0;0m \u001b[0;44mExample\u001b[0;0m \u001b[0;45mExample\u001b[0;0m \u001b[0;46mExample\u001b[0;0m \u001b[0;47mExample\u001b[0;0m

Backgrounds & Colors

\u001b[0;40;30mExample\u001b[0;0m \u001b[0;40;31mExample\u001b[0;0m \u001b[0;40;32mExample\u001b[0;0m \u001b[0;40;33mExample\u001b[0;0m \u001b[0;40;34mExample\u001b[0;0m \u001b[0;40;35mExample\u001b[0;0m \u001b[0;40;36mExample\u001b[0;0m \u001b[0;40;37mExample\u001b[0;0m
\u001b[0;41;30mExample\u001b[0;0m \u001b[0;41;31mExample\u001b[0;0m \u001b[0;41;32mExample\u001b[0;0m \u001b[0;41;33mExample\u001b[0;0m \u001b[0;41;34mExample\u001b[0;0m \u001b[0;41;35mExample\u001b[0;0m \u001b[0;41;36mExample\u001b[0;0m \u001b[0;41;37mExample\u001b[0;0m
\u001b[0;42;30mExample\u001b[0;0m \u001b[0;42;31mExample\u001b[0;0m \u001b[0;42;32mExample\u001b[0;0m \u001b[0;42;33mExample\u001b[0;0m \u001b[0;42;34mExample\u001b[0;0m \u001b[0;42;35mExample\u001b[0;0m \u001b[0;42;36mExample\u001b[0;0m \u001b[0;42;37mExample\u001b[0;0m
\u001b[0;43;30mExample\u001b[0;0m \u001b[0;43;31mExample\u001b[0;0m \u001b[0;43;32mExample\u001b[0;0m \u001b[0;43;33mExample\u001b[0;0m \u001b[0;43;34mExample\u001b[0;0m \u001b[0;43;35mExample\u001b[0;0m \u001b[0;43;36mExample\u001b[0;0m \u001b[0;43;37mExample\u001b[0;0m
\u001b[0;44;30mExample\u001b[0;0m \u001b[0;44;31mExample\u001b[0;0m \u001b[0;44;32mExample\u001b[0;0m \u001b[0;44;33mExample\u001b[0;0m \u001b[0;44;34mExample\u001b[0;0m \u001b[0;44;35mExample\u001b[0;0m \u001b[0;44;36mExample\u001b[0;0m \u001b[0;44;37mExample\u001b[0;0m
\u001b[0;45;30mExample\u001b[0;0m \u001b[0;45;31mExample\u001b[0;0m \u001b[0;45;32mExample\u001b[0;0m \u001b[0;45;33mExample\u001b[0;0m \u001b[0;45;34mExample\u001b[0;0m \u001b[0;45;35mExample\u001b[0;0m \u001b[0;45;36mExample\u001b[0;0m \u001b[0;45;37mExample\u001b[0;0m
\u001b[0;46;30mExample\u001b[0;0m \u001b[0;46;31mExample\u001b[0;0m \u001b[0;46;32mExample\u001b[0;0m \u001b[0;46;33mExample\u001b[0;0m \u001b[0;46;34mExample\u001b[0;0m \u001b[0;46;35mExample\u001b[0;0m \u001b[0;46;36mExample\u001b[0;0m \u001b[0;46;37mExample\u001b[0;0m
\u001b[0;47;30mExample\u001b[0;0m \u001b[0;47;31mExample\u001b[0;0m \u001b[0;47;32mExample\u001b[0;0m \u001b[0;47;33mExample\u001b[0;0m \u001b[0;47;34mExample\u001b[0;0m \u001b[0;47;35mExample\u001b[0;0m \u001b[0;47;36mExample\u001b[0;0m \u001b[0;47;37mExample\u001b[0;0m

Bold

\u001b[1;30mExample\u001b[0;0m \u001b[1;31mExample\u001b[0;0m \u001b[1;32mExample\u001b[0;0m \u001b[1;33mExample\u001b[0;0m \u001b[1;34mExample\u001b[0;0m \u001b[1;35mExample\u001b[0;0m \u001b[1;36mExample\u001b[0;0m \u001b[1;37mExample\u001b[0;0m

Underlined

\u001b[4;30mExample\u001b[0;0m \u001b[4;31mExample\u001b[0;0m \u001b[4;32mExample\u001b[0;0m \u001b[4;33mExample\u001b[0;0m \u001b[4;34mExample\u001b[0;0m \u001b[4;35mExample\u001b[0;0m \u001b[4;36mExample\u001b[0;0m \u001b[4;37mExample\u001b[0;0m
@imtumbleweed
Copy link

imtumbleweed commented May 25, 2024

i hope discord devs add support for color in regular chat without having to use code blocks. thanks for this page, it was used as a reference in this article about using color in text on discord which also has a link to the youtube tutorial that has 58K views! clearly, there is so much demand for this feature, discord should just add it out of the box.

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