One thing Discord doesn't support particularly well is a vibrant and colorful text chat experience. There's text chat, but there are no built-in color controls and, on the face of it, no way to do anything "fancy" with your text. Plain text can get very boring very quickly – but in fact, there are ways to change the color of your text.
In this article, we are going to show you how to get vibrant colors in your Discord text chats.
How it works
The key to this method of adding color to text is that Discord uses JavaScript to create its interfaces, along with a theme known as Solarized Dark and a library called Highlight.js. That is, when you're logged into your Discord server, the page you see is rendered by a series of rather sophisticated JavaScript programs, including Highlight.js.
Although Discord's native UI does not support coloring your text, the underlying JavaScript engine, running the Highlight.js script, does. By inserting what amounts to code snippets into your text chat, you can change the color of the words printed in everyone's text chat window.
The basic concept to understand is that to change the color of a given piece of text, you need to encapsulate that text in a block of code. This is a three line text block with your text as the middle block.
Use of the "Back Quote" Symbol
To color code any text in Discord, you will need to use the back quote symbol located in the upper left corner of your keyboard. It accompanies the Tilde symbol:
Write the first line of code
The first line of the code block should be three backquote symbols (” '), followed by the code phrase that tells the Solarized Dark theme which color to display. It should look like this:
Notes: "CSS" may change to something like "Tex" or another phrase depending on the output you desire. We'll cover that below.
Type the second line
The second line should be your typed text as you normally would. Hold "Shift + Enter" to create a new row. Clicking the "Enter" button alone will send the message, so you'll need to hold "Shift" with it.
Type your third line
The third line of the code block should contain three more quotation marks: (“`). It rarely changes, no matter what result you expect, and it should look like this:
Because we used `` CSS, your text should look like this:
Entering your text
There are two basic ways to enter text this way. The first way is to have a text file on your computer with the various codes for the various text colors that you can access that way and cut and paste the segments you want to use.
Another way is to enter the block of code directly into the Discord chat engine line by line. Type a line, then hit "shift-Enter" to create another line without actually sending the message to Discord. Type the second line and press Shift-Enter again. Then type the third line and press Enter, and the whole block will be sent at once and display your text.
There are some limitations to this method. First, you have to do this for each line of text you want to color – you can't just turn the color on or off. Second, your text will appear in a box on the Discord server.
Your color options
Highlight.js codes provide access to seven new colors in addition to the default gray. Once you figure them out, markdown codes start to make a lot of sense, don't be afraid to play around and try to come up with some new ones.
Here are the codes and examples of how they look.
Plain gray (but in a box)
“Sample Text”
Green (sort of)
» `CSS
Sample text
"`
Another way to create green text is to use the diff method. It looks like this:
« `diff
+Example text
"`
Adding a '+' before your text will change the color to green.
Cyan
“Yaml
Sample text
"`
Yellow
“`HTTP
Sample text
"`
Orange
«.
Sample text
"`
(Note that here's an example of flaky behavior - only the first word was colorized, and I couldn't get it to colorize the entire line).
red
“to excel
Sample text
"`
(Another puff pastry).
Yellowish?
There are several ways to get yellow text. The first is quite reliable, while the second method only highlights a few words.
» `Repair
Sample text
"`
»'Footsteps
Sample text
"`
Note that the elm The command only highlights words that begin with capitals.
Blue
" This
[Sample Text]
"`
Advanced Techniques
There are other ways to display your text in color using the same basic technique but in a more advanced way. The reason this all works (sort of) is that these formats are meant to display blocks of code when a developer writes a program.
The first text after the `` tells Highlight.js which scripting language to format, and there are actually explicit ways to transpose the colors directly into a line.
Here are some of the languages you can use and ways to force color. Experiment with them and you'll soon find yourself writing colorful text messages all the time.
You can even use a variety of mediums to achieve the look you want. Disappointed with your blue options? Try that:
Then there's this nifty trick for color-coding texts:
Finally, you can also use ``tex to create quite colorful messages. Try different symbols to make your text appear differently:
For more information on this, check out Highlight.js.org or join the Discord server Highlight.js.
Other things to try:
We noticed that the entries above do not work for all users.
If the CSS doesn't work, try:
» `CSS
sample text”
This seems to fix most issues in CSS. If you're using the Discord desktop app or if you're using the web browser, this may affect how you'll need to type in markdown codes. Once you've typed in the perfect markdown that's right for you, feel free to copy and paste it to your desktop for quick access later.
Bots Discord
There are many Discord bots available that offer to change certain colors on your server. Many of them update the colors of certain roles. but no text. According to our research, there are no bots that will make it easier to change your text color.
For even more advanced users, Discord also lets you add embeds and webhooks as messages. These can be used to display color blocks and also support markdown text. You can see how this feature works by heading to Webhook Discord.
Other text customization options
There are more options for playing with your text on Discord.
gras – ** It's in bold **
Italic – *This is italicized*
Bold and italic – *** It's in bold and italic *** (Makes sense, doesn't it?)
Underline – _This makes underlined text_
Strikethrough- ~~This is crossed out by text~~
The more you get to know Discord, the more there is to learn. Play around with these options and you'll soon realize that you can do more like *** underlined, bold and italic*** text. Once you've become an expert, you might want to show others how to make these customizations. If so, just put a backslash between the content like *Italicized*.
Frequently Asked Questions
What can I do if some of them don't work?
Based on our July 2022 testing, we saw more success using the markdowns listed above on the Discord desktop app than the web client. If you're having trouble with these codes, try the app instead. Of course, as we mentioned above, some of them work better than others, no matter what version of Discord you are using. But, overall, they are quite reliable.
Is there a bot for Discord that can color text?
Absoutely! A simple search online will bring up a number of bots that can change the color of your text in Discord. Just do a broad search and review the ones that best suit your needs. Check the ratings and capabilities of each bot and add them to your server.
These don't work for me. What else can I do?
The most common reason the above examples don't work for our readers is that Discord only recognizes the backtick, not the quotes. In the upper left corner of your keyboard, you will see the backtick key with the tilde option above it. Use this key instead of quotes (the key on the right side of your keyboard next to the Shift key).
