How to Easily Format Tables in Markdown
Date Published: 01 July 2020
I'm a big fan of Markdown. It provides a simple way to richly format text without the complexity or security issues that would come from using HTML. Support for Markdown is ubiquitous within the software development industry, with native support everywhere from GitHub to StackOverflow. I've written everything from short documentation articles to several entire ebooks for Microsoft using Markdown. I've even recently moved my blog to GatsbyJS/Netlify/Github using Markdown (you can see this article's source here)! But one thing that has always been a real pain with Markdown is table formatting.
Tables are often the best way to present some data. I learned about HTML tables early in my career, before CSS really was a thing, and we used them not just for data presentation but also layout. I got pretty good at defining TR and TD tags and spanning this or that cell across multiple rows or columns to make it fit where I wanted. Markdown doesn't do any of that. There are no tags. Instead, you basically draw the tables as ASCII art by using | and - characters. In my experience it's quite tedious and easy to get wrong when doing it by hand.
Fortunately, you don't have to.
Markdown Tables Generator
There's a really nice tool I found recently called Tables Generator. It's a web site that will let you author your table and then click a button to generate the Markdown needed to produce it. It also supports LaTeX and HTML table syntax if you prefer. Just click on the sample table and start adding text. When you're ready, click Generate to see the resulting Markdown. Then copy/paste it into your markdown file and you're done!
That's really all there is to it. The tool supports some basic formatting and makes it easy to build the table you need. It was a big help to me recently on some work I was doing that involved a few complex tables. I hope you find it useful.
Steve is an experienced software architect and trainer, focusing currently on ASP.NET Core and Domain-Driven Design.