Markdown Table Generator

What is the Markdown Table Generator?

Tables are the part of Markdown that people get wrong most often, and the failure is silent. Miss the row of dashes under your header and the whole block renders as one long paragraph. Put one pipe too few in a row and the cells after it shift into the wrong columns. Nothing warns you — you find out when the README is already pushed.

So write the table here first. The preview on the right updates as you type, so a missing separator row or an uneven pipe count shows up immediately rather than after a commit. Alignment behaves the same way: change :--- to :---: and the column visibly re-centres, which is far easier than remembering which side the colon belongs on.

Table syntax comes from the GFM tables extension, not from the CommonMark core — which is exactly why a table that looks fine on GitHub can come out as raw pipes somewhere else. This preview follows the same rules GitHub does. For a second opinion on a finished file, a markdown file viewer is a quick way to catch a renderer disagreement.

How to Build a Markdown Table

1. Write the Header Row – Separate your column names with pipes: | Method | Endpoint | Returns |. A leading and trailing pipe is optional, but keeping them makes the source far easier to scan.
2. Add the Separator Row – Directly underneath, a row of dashes for each column. This row is not optional — without it there is no table, just a paragraph.
3. Set the Alignment – Colons in the separator row control it: :--- for left, :---: for centered, ---: for right. The preview shifts each column as you type them.
4. Fill in the Rows – One row per line, same number of pipes as the header. Cells do not need to line up in the source — that is only for readability — but the pipe count does have to match.
5. Copy the Result – Copy takes the rendered HTML for pasting into a CMS or template. The Markdown itself is already in the left pane, ready to paste into your README.

Pro Tip: A pipe inside a cell ends that cell early — write it as \| instead. This is the single most common reason a table publishes with its columns scrambled, and the preview here shows it straight away.

Example

Three columns, each with a different alignment. Notice that only the separator row changes — the data rows are identical whichever way the columns sit.

| Method | Endpoint     | Returns      |
| :----- | :----------: | -----------: |
| GET    | /subscribers | Subscriber[] |
| POST   | /plans       | Plan         |

The second row carries the alignment:
:--- left, :---: centered, ---: right

Common Use Cases

API Tables in a README

Method, endpoint, what it returns, whether it needs auth — the classic README table, and the one most likely to have a stray pipe in a path or a type like Subscriber[] that trips the syntax. Getting it right here takes seconds; fixing it after review does not.

Comparison and Pricing Tables

Feature comparisons live or die on alignment. Numbers want to be right-aligned, labels left, ticks and crosses centered. Watching the columns move as you edit the colons is much faster than pushing, looking, and going back.

Fixing a Table Someone Else Wrote

Inheriting a broken table in a docs pull request is common, and staring at raw pipes rarely reveals which row is short. Paste it in and the preview shows exactly where the columns stop lining up.

Release Notes and Changelogs

Change tables get rewritten every release, which is enough repetition for small mistakes to slip through. A quick preview before publishing catches the row that lost a pipe. If the data behind it started as JSON, our JSON to Table converter is the better starting point.

Key Features

• Live preview — the table renders as you type, so mistakes surface immediately.
• Alignment you can see — left, centered, and right columns update the moment you edit the colons.
• Real GFM rules — the same table parsing GitHub, GitLab, and most static site generators use.
• Everything else renders too — headings, lists, and code around your table show up exactly as they will publish.
• Runs in your browser — nothing is uploaded, which matters for internal documentation.
• Copy or download the HTML — take the rendered table somewhere that wants markup.

Frequently Asked Questions

Why is my table rendering as a paragraph?

Almost always the separator row. A Markdown table needs a row of dashes directly under the header — | --- | --- | — with no blank line between them. Without it there is nothing to tell the parser those pipes were a table.

How does column alignment work?

Colons in the separator row: :--- aligns left, :---: centers, and ---: aligns right. Each column is set independently, so you can mix all three in one table.

Do the pipes need to line up in the source?

No. Padding cells so the source looks neat is purely for whoever edits it next — the parser only counts pipes. What does matter is that every row has the same number of them as the header.

What if my cell contains a pipe character?

Escape it as \|. An unescaped pipe ends the cell early and pushes everything after it one column left, which is why a table can look scrambled without any obvious error.

Can I use bold, links, or code inside a cell?

Yes — inline formatting works in table cells, so **bold**, links, and backtick code all render. Block-level things like lists and headings do not; use <br> if a cell needs a line break.

Will these tables work everywhere?

Anywhere GFM tables are supported: GitHub, GitLab, Bitbucket, and most static site generators. A strict CommonMark renderer will show the raw pipes instead, since tables are an extension rather than part of the core spec.

Related Tools

• Markdown Viewer – Read a whole document rendered, not just a table.
• Markdown to HTML – Get the HTML source for the table instead of the rendering.
• JSON to Table – Turn a JSON array into a sortable, filterable table you can explore.
• JSON to CSV – Flatten a JSON array into values a spreadsheet can open.
• XML to Table – The same table view for XML documents.

Useful Resources

• Markdown Guide — Tables – The syntax written out with examples, including the alignment colons.
• MDN — The Table Element – What your table becomes once it is rendered, if you need to style it.