Markdown table: How to Create a Great Looking Table

Markdown tables are not part of the original Markdown spec. Instead, it was suggested to use the HTML <table> tag. Although that works well, it looks messy. Luckily, there are now better options, since subsequent Markdown specs like GitHub Flavoured Markdown (GFM) and Markdown Here do support Markdown tables. In fact, most modern Markdown parsers support tables as described on this page. In case of doubt, my advice is always to simply try if it works.

A basic Markdown table

A table is ‘drawn’ using something resembling ASCII art. You can make it look as pretty or as ugly as you want:

| Item         | Price     | # In stock |
|--------------|-----------|------------|
| Juicy Apples | 1.99      | *7*        |
| Bananas      | **1.89**  | 5234       |

The result:

ItemPrice# In Stock
Juicy Apples1.997
Bananas1.895234
Example table rendered to HTML

A few things to note:

  • Start with a header row
  • Use at least 3 dashes to separate the header cells
  • Separate cells with a pipe symbol: |
  • Outer pipes are optional
  • Cells can contain markdown syntax. See our Markdown cheat sheet for all the Markdown formatting you might need.

You don’t need to make the table look pretty. This will give the exact same result as the table above:

Item | Price | # In stock
---|---|---
Juicy Apples | 1.99 | 739
Bananas | 1.89 | 6

Aligning columns

You can align columns to the left, center, or right. Alignment is specific around the dashes below the header cell:

  • To align left, add a colon to the left, like :--- (this is the default)
  • For right alignment, add a colon to the right, like: ---:
  • And finally, for center alignment, add two colons, like: :---:

Here’s our product table again, with center-aligned prices and right-aligned stock information. Note that I nicely aligned the text in the entire column, but you don’t have to:

| Item         | Price | # In stock |
|--------------|:-----:|-----------:|
| Juicy Apples |  1.99 |        739 |
| Bananas      |  1.89 |          6 |

The result:

ItemPrice# In Stock
Juicy Apples1.99739
Bananas1.896
Example table rendered to HTML, with alignment

Center a table in Markdown

Believe it or not, there’s no markdown syntax to center a table. You’ll need to resort to HTML. in my article on centering stuff, I cover three different methods to center a table in markdown.

Markdown table generator

Markdown tables are not difficult to create, but it’s tedious, and a mistake is made easily. Hence, several people took it upon themselves to create awesome Markdown table generators. Here’s a list of sites offering such generators (ordered by my preference):

Populating your tables from SQLite

If you happen to use SQLite, you might be delighted to learn that SQLite can direct output query results in Markdown and HTML format. To learn more about this, read my articles on creating SQLite Markdown output.

Conclusion

You’ve learned how to create tables in Markdown, how to center a table, and how to align its columns. We’ve also discussed markdown table generators and the fact that SQLite can output markdown for you.