CODEWITHSUNDEEP
gitlabmarkdown
Cesarz
Cesarz

Reputation: 447

How to color text in Markdown/GitLab

I'm trying color text in markdown. In editor preview all looks good, but when I push it to a GitLab repository the text is not colored. How can I color text?

In his beard lived three <span style="color:red">cardinals</span>.

enter image description here

Upvotes: 37

Views: 51155

Answers (2)

mike
mike

Reputation: 2106

Unfortunately most of the HTML hacks for doing color in Markdown will be nullified by GitLab's presentation layer.

GitLab's inline diffs will work for Markdown displayed by GitLab in Issues, Wikis, and by the Markdown Preview.

It supports [- red text -] and [+ green text +] but no others. Besides its intended purpose, this is useful for highlighting in Markdown documentation and comments because it is the background that is shaded, not the lettering.

As answered by @dejanualex, you can also use inline LaTeX (the documentation does not render the LaTeX, so this is better viewed in the docs code on GitLab itself). I made an example snippet here: https://gitlab.com/-/snippets/3606132

enter image description here

It works when KaTeX is installed and enabled, which it is on gitlab.com. See also https://stackoverflow.com/a/42081405/776953.

Because it's LaTeX, it uses the LaTeX font. If you want to match GitLab's Markdown font, set the LaTeX font with \sf or \textsf. See https://katex.org/docs/supported.html#style-color-size-and-font

Upvotes: 21

dejanualex
dejanualex

Reputation: 4358

You could try this it seems that Gitlab renders it pretty nice, hope it helps:

$`\textcolor{red}{\text{your text}}`$ 
$`\textcolor{blue}{\text{your text}}`$ 
$`\textcolor{green}{\text{your text}}`$

Also there's diff fence:

```diff
- RED text
+ GREEN text
! ORANGE text
# GRAY text
```

enter image description here

Upvotes: 39

Related Questions