Formatting Text

Markdown makes it easy to format messages. Type a message as you normally would and use these rules to render it with special formatting techniques.

For a layman’s guide to Markdown on Mattermost, see this blog post.

Text Style

You can use either _ or * around a word to make it italic, or __ or ** around a word to make it bold. You can also use common keyboard shortcuts, including CTRL/CMD+B to bold, and CTRL/CMD+I to italicize.

  • *italics* (or _italics_) renders as italics
  • **bold** renders as bold
  • ***bold-italic*** renders as Bold Italics
  • ~~strikethrough~~ renders as Strike Through


Make a heading by typing # and a space before your title. For smaller headings, use more #s.

## Large Heading
### Smaller Heading
#### Even Smaller Heading

Renders as:

Large Heading

Alternatively, you can underline the text using === or --- to create headings.

Large Heading

Renders as:

Smaller Heading


Create a list by using * or - as bullets. Indent a bullet point by adding two spaces in front of it.

* item one
* item two
  * item two sub-point

Renders as:

  • item one
  • item two
    • item two sub-point

Make it an ordered list by using numbers instead:

1. Item one
1. Item two
1. item three

Renders as:

  1. Item one
  2. Item two
  3. Item three

You can also start a list at any number:

4. The first list number is 4.
1. The second list number is 5.
1. The third list number is 6.

Renders as:

  1. The first list number is 4.
  2. The second list number is 5.
  3. The third list number is 6.

Make a task list by including square brackets:

- [ ] Item one
- [ ] Item two
- [x] Completed item

Renders as:


Code Block

Creating a fixed width code block is recommended for pasting multi-line blocks of code or other text output that is easier to read with fixed width font alignment. Examples include block text snippets, ASCII tables, and log files.

This can be accomplished in one of two ways:

  1. Placing 3x backticks ``` on the line directly above and directly below your code:
this is my
code block
  • TIP - Enter 3x backticks ```, SHIFT + ENTER, <type_your_code>, SHIFT + ENTER, and finally 3x backticks ```.
  1. Indenting each line by four spaces:
    this is my
    code block

^^^^ 4x spaces

Syntax highlighting

To add syntax highlighting, type the language to be highlighted after the ``` at the beginning of the code block. Mattermost also offers four different code themes (GitHub, Solarized Dark, Solarized Light, Monokai) that can be changed in Account Settings > Display > Theme > Custom Theme > Center Channel Styles.

Supported languages are: applescript, as, atom, bas, bash, boot, _coffee, c++, c, cake, cc, cl2, clj, cljc, cljs, cljs.hl, cljscm, cljx, cjsx, cson, coffee, cpp, cs, csharp, css, d, dart, dfm, di, delphi, diff, django, docker, dockerfile, dpr, erl, fortran, freepascal, fs, fsharp, gcode, gemspec, go, groovy, gyp, h++, h, handlebars, hbs, hic, hpp, html, html.handlebars, html.hbs, hs, hx, iced, irb, java, jinja, jl, js, json, jsp, jsx, kt, ktm, kts, latexcode, lazarus, less, lfm, lisp, lpr, lua, m, mak, matlab, md, mk, mkd, mkdown, ml, mm, nc, objc, obj-c, osascript, pas, pascal, perl, pgsql, php, php3, php4, php5, php6, pl, plist, podspec, postgres, postgresql, ps, ps1, pp, py, r, rb, rs, rss, ruby, scala, scm, scpt, scss, sh, sld, st, styl, sql, swift, tex, texcode, thor, ts, tsx, v, vb, vbnet, vbs, veo, xhtml, xml, xsl, yaml, zsh,


``` go
package main
import "fmt"
func main() {
    fmt.Println("Hello, 世界")

Renders as:

GitHub Theme

Syntax Highlighting in GitHub

Solarized Dark Theme

Syntax Highlighting Dark

Solarized Light Theme

Syntax Highlighting Light

Monokai Theme

Syntax Highlighting Monokai

In-line Code

Create in-line monospaced font by surrounding it with backticks (`), not with single quotes (‘).


Renders as: monospace.

In-line Images

Add in-line images by using an exclamation mark followed by the alt text in square brackets then the URL of the image in round brackets. You can add hover text by placing the text in quotes after the link.

![ {alt text} ]( {URL of image}{Hover text})

If the height of the original image is more than 500 pixels, the system sets the height at 500 pixels and adjusts the width to maintain the original aspect ratio.

You can set the width and height of the displayed image by using an equals sign and the width x height after the URL of the image. If you set only the width, the system adjusts the height to maintain the original aspect ratio.


Inline image with hover text
![Mattermost](../../images/icon-76x76.png "Mattermost Icon")

Renders as:

Inline image with link

Note the extra set of square brackets.


Renders as:

Inline image displayed at 50 pixels wide and 76 pixels high
![Mattermost](../../images/icon-76x76.png =50x76 "Mattermost Icon")

Renders as:

Inline image displayed at 50 pixels wide and the height adjusted to suit
![Mattermost](../../images/icon-76x76.png =50 "Mattermost Icon")

Renders as:



Create a line by using three *, _, or -.


Renders as:

Block quotes

Create block quotes using >.

> block quotes renders as:



Create a table by placing a dashed line under the header row and separating the columns with a pipe |. (The columns don’t need to line up exactly for it to work). Choose how to align table columns by including colons : within the header row.

| Left-Aligned  | Center Aligned  | Right Aligned |
| :------------ |:---------------:| -----:|
| Left column 1 | this text       |  $100 |
| Left column 2 | is              |   $10 |
| Left column 3 | centered        |    $1 |

Renders as:

Markdown Table Sample

Math Formulas

Create formulas by using LaTeX in a latex Code Block.

Note: This feature is disabled by default. Contact your System Admin to enable this setting in System Console > Site Configuration > Posts to use this feature.

X_k = \sum_{n=0}^{2N-1} x_n \cos \left[\frac{\pi}{N} \left(n+\frac{1}{2}+\frac{N}{2}\right) \left(k+\frac{1}{2}\right) \right]

Renders as:

Markdown Math Sample
Report a Problem
Edit on GitHub