Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in
Celebration

Earn badges and make progress

You're on your way to the next level! Join the Kudos program to earn points and save your progress.

Deleted user Avatar
Deleted user

Level 1: Seed

25 / 150 points

Next: Root

Avatar

1 badge earned

Collect

Participate in fun challenges

Challenges come and go, but your rewards stay with you. Do more to earn more!

Challenges
Coins

Gift kudos to your peers

What goes around comes around! Share the love by gifting kudos to your peers.

Recognition
Ribbon

Rise up in the ranks

Keep earning points to reach the top of the leaderboard. It resets every quarter so you always have a chance!

Leaderboard

Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,552,581
Community Members
 
Community Events
184
Community Groups

Why isn't code showing with red text anymore?

The Trello docs show that text entered between backticks `like this` should appear in red text. For me it's showing as black text on a light gray background. This means that these snippets no longer stand out in my cards like they used to.

 

This previous question suggests turning off colorblind mode, but I don't have it on. I turned it on then turned it off again (haha) and there was no change in the code text color. I tried it in Brave and Firefox browsers and it's always black on light gray background.

 

How can I get `code` text to be red again? I use this for action items as well as code so it needs to stand out.

2 answers

It is possible to convert all code text in Trello for the web app using an extension that enables you to add custom CSS rules.

You can use a CSS class selector to select all elements of the "code" class and change the text color to red (along with other changes such as "font-weight" and "font-size"):

```
code {
     color: ${#ff0000} !important;
}
```

See the last comment on this related Trello forum post for how to write code blocks (not inline code) such that your custom CSS does not affect them.

You can use the Pro for Trello Chrome extension as it has a setting for custom CSS on Trello.

I like to use the dev tools options in the Dark Reader Chrome extension because it enables to set custom CSS rules for any website.

This can be replicated on other browsers using similar extensions. Injecting custom CSS is not possible in the Android or IOS apps.

0 votes
Vishaal S
Atlassian Team
Atlassian Team members are employees working across the company in a wide variety of roles.
Sep 09, 2022

Hi Niam,

Welcome to Trello Community!

We have recently implemented new changes to how the Editor works on Trello cards, and one of these changes was to change the inline code (`text`) from red to grey. This was a permanent style change that has been rolled out, and right now, there's no way to revert it back to how it was. We'll have the image from the document updated!

I'll be here if you have any questions or need anything else. 

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events