Is there a way to get colored text in GitHubflavored Markdown? [duplicate]

Question

In case this may be helpful for someone who just needs to show colors rather than output, as a hackish workaround (and FYI), since GitHub supports Unicode (as Unicode, numeric character references or HTML entities), you could try colored Unicode symbols, though it depends on the font rendering them in color (as it happens to be appearing for me on Windows 10 and Mac 10.12.5, at least, though on the Mac at least, the up/down-pointing small red triangles don't show in red):

• RED APPLE (🍎): 🍎
• GREEN APPLE (🍏): 🍏
• BLUE HEART (💙): 💙
• GREEN HEART (💚): 💚
• YELLOW HEART (💛): 💛
• PURPLE HEART (💜): 💜
• GREEN BOOK (📗): 📗
• BLUE BOOK (📘): 📘
• ORANGE BOOK (📙): 📙
• LARGE RED CIRCLE (🔴): 🔴
• LARGE BLUE CIRCLE (🔵): 🔵
• LARGE ORANGE DIAMOND (🔶): 🔶
• LARGE BLUE DIAMOND (🔷): 🔷
• SMALL ORANGE DIAMOND (🔸): 🔸
• SMALL BLUE DIAMOND (🔹): 🔹
• UP-POINTING RED TRIANGLE (🔺): 🔺
• DOWN-POINTING RED TRIANGLE (🔻): 🔻
• UP-POINTING SMALL RED TRIANGLE (🔼): 🔼
• DOWN-POINTING SMALL RED TRIANGLE (🔽): 🔽

You cannot get green/red text, but you can get green/red highlighted text using the diff language template. Example:

```diff
+ this text is highlighted in green
- this text is highlighted in red
```

You cannot include style directives in GFM.

The most complete documentation/example is "Markdown Cheatsheet", and it illustrates that this element <style> is missing.

If you manage to include your text in one of the GFM elements, then you can play with a github.css stylesheet in order to colors that way, meaning to color using inline CSS style directives, referring to said css stylesheet.

You can not color plain text in a GitHub README.md file. You can however add color to code samples in your GitHub README.md file with the tags below.

To do this, just add tags, such as these samples, to your README.md file:

```json
   // Code for coloring
```
```html
   // Code for coloring
```
```js
   // Code for coloring
```
```css
   // Code for coloring
```
// etc.

---

**Colored Code Example, JavaScript:** place this code below, in your GitHub README.md file and see how it colors the code for you.

  import { Component } from '@angular/core';
  import { MovieService } from './services/movie.service';

  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css'],
    providers: [ MovieService ]
  })
  export class AppComponent {
    title = 'app works!';
  }

---

No "pre" or "code" tags are needed.

This is now covered in the GitHub Markdown documentation (about half way down the page, there's an example using Ruby). GitHub uses Linguist to identify and highlight syntax - you can find a full list of supported languages (as well as their markdown keywords) over in the Linguist's YAML file.

DEMO

As an alternative to rendering a raster image, you can embed a SVG:

https://gist.github.com/CyberShadow/95621a949b07db295000

Unfortunately, even though you can select and copy text when you open the .svg file, the text is not selectable when the SVG image is embedded.