WebToolsPlanet
converter Tools

Markdown Table Generator

Create GFM Markdown tables visually — add rows/columns, align cells, import from CSV/spreadsheet paste, and copy the formatted table code.

Last updated: March 25, 2026

Client-Side Processing
Input Data Stays on Device
Instant Local Execution

Find this tool useful? Support the project to keep it free!

Buy me a coffee

What is Markdown Table Generator?

Markdown tables use GitHub Flavored Markdown (GFM) table syntax: a header row of pipe-separated column names, a separator row with dashes defining alignment (`---` for left, `:---:` for center, `---:` for right), and then data rows. While powerful for documentation, writing Markdown table syntax by hand is tedious — especially for tables with many columns, numeric data requiring right-alignment, or data copied from spreadsheets.

The Markdown Table Generator provides a spreadsheet-like visual editor: click cells to edit, Tab to move between cells, and the GFM Markdown output updates in real-time. It solves the most common table authoring friction points: adding rows and columns with one click, setting column alignment visually, pasting data directly from Excel or Google Sheets (tab-separated data), and importing CSV files. The output is valid GFM syntax accepted by GitHub, GitLab, Bitbucket, Notion, Obsidian, VS Code, Jira, and any GFM-compatible Markdown renderer.

How to Use Markdown Table Generator

1

Click any cell in the starter table to edit it — press Tab to move to the next cell, Shift+Tab to go back

2

Use the "+" buttons at the right edge and bottom to add new columns or rows respectively

3

Click the alignment icon in each column header to cycle through left / center / right alignment

4

To import data, click "Import CSV" to upload a .csv file, or copy cells from Excel/Google Sheets and paste into the first cell

5

Copy the generated Markdown from the right panel using "Copy Markdown" or download as a .md file

Common Use Cases

  • Adding a dependency comparison table to a GitHub README without manually formatting pipe characters
  • Creating a feature comparison matrix in developer documentation (Notion, Confluence, GitBook)
  • Generating a changelog table for a project's CHANGELOG.md with columns: Version, Date, Changes
  • Building a quick reference table for API endpoints in a REST API documentation file
  • Converting a Google Sheets project status table to Markdown for pasting into a GitHub issue
  • Creating a benchmark results table for a technical blog post or performance comparison writeup
  • Building a structured data table in a Jira wiki page for sprint planning or requirements documentation
  • Generating an accessibility quick reference table for a design system documentation page

Example Input and Output

Generating a formatted API endpoint reference table from a 3×4 grid:

Table editor data (3 cols, 4 rows)
Column 1: Method | Column 2: Endpoint | Column 3: Description
Alignment: center  | left               | left

Row 1: GET    | /users         | List all users
Row 2: POST   | /users         | Create a user
Row 3: PUT    | /users/{id}    | Update a user
Row 4: DELETE | /users/{id}    | Delete a user
Generated GFM Markdown
| Method | Endpoint | Description |
| :----: | :------- | :---------- |
| GET | /users | List all users |
| POST | /users | Create a user |
| PUT | /users/{id} | Update a user |
| DELETE | /users/{id} | Delete a user |

Client-Side Processing

All table editing and Markdown generation runs in your browser. Data you enter into the table editor is never sent to our servers.

Formatting for Readability with Prettier

The generated GFM Markdown uses minimal spacing (cells not padded to equal widths). For aligned, "pretty" table output where columns have consistent width: run the output through Prettier (prettier --parser markdown). Prettier's Markdown formatter pads all cells to equal widths, making the raw Markdown source much more readable. Most .prettierrc.json configurations automatically format Markdown table cells when running Prettier on .md files.

GitHub Table Scroll on Mobile

Wide tables on GitHub (many columns) render without horizontal scroll on mobile, causing overflow. Workaround: wrap your Markdown table in an HTML div with overflow-x:auto — GitHub's Markdown renderer passes through this HTML: <div style="overflow-x:auto">| col | col | ... |</div>. This works in GitHub but not all Markdown renderers accept raw HTML.

Frequently Asked Questions

What Markdown flavors support table syntax?
Tables are a GitHub Flavored Markdown (GFM) extension — they are not part of the original John Gruber Markdown specification or CommonMark. GFM tables are supported by: GitHub (README, issues, pull requests, wikis), GitLab (all Markdown contexts), Bitbucket (README files), VS Code (preview panel), Notion, Obsidian, Jira (wiki markup), GitBook, Docusaurus (MDX), and most static site generators (Gatsby, Hugo, Jekyll). Standard CommonMark renderers that don't include GFM extensions will render the pipe characters as plain text instead of a table.
How does column alignment work in GFM tables?
Column alignment is set by the separator row between the header and first data row. Left-aligned: --- or :--- (default). Center-aligned: :---:. Right-aligned: ---:. Example: | Left | Center | Right | / | :--- | :----: | ----: |. Alignment only applies to how Markdown renderers display the column — it does not affect text width or pad cells to fixed widths. GitHub renders left-aligned by default if no colon is specified.
Can I paste spreadsheet data directly?
Yes. Copy cells from Excel, Google Sheets, or Numbers and paste into the first cell of the editor. Tab-separated clipboard data (the default format when copying from spreadsheets) is automatically detected and expanded into the appropriate rows and columns. Comma-separated (CSV) data can also be pasted, but some spreadsheet cells may contain commas themselves — for that case, use the "Import CSV" button with a properly quoted CSV file instead.
How do I include pipe characters inside a table cell?
The pipe character (|) is the GFM table cell separator, so it must be escaped inside cell content: write \| to represent a literal pipe. Example: | a \| b | c | renders as a cell containing "a | b". Alternatively, use the HTML entity &vert; or &VeryThinSpace; which some renderers accept. Newlines inside cells are not supported in GFM — each row must be on a single line.
Is there a row or column limit?
GFM has no formal limit on table size. Practically: very wide tables (20+ columns) may overflow horizontally in Markdown renderers without scroll support (GitHub wraps wide tables; Notion scrolls them). Very tall tables are fine syntactically. For readability, tables over 10 columns should be broken into multiple focused tables. GitHub's Markdown renderer wraps text within cells, so narrow columns with long content create tall cells.
How can I convert an existing HTML table to Markdown?
To convert an HTML <table> to GFM Markdown: online tools like html2markdown.com perform this conversion. In Pandoc (CLI): pandoc input.html -f html -t gfm -o output.md. From a website table: right-click a table in Chrome → "Copy" → paste into html-to-markdown converter. The reverse (Markdown → HTML) is handled by the Markdown to HTML tool on this site. Note: complex HTML tables with rowspan, colspan, or nested elements cannot be represented in GFM Markdown syntax.

How This Tool Works

Table data is maintained in a 2D array state. The Markdown output is generated by serializing the array: the header row is joined with " | " and wrapped in leading/trailing pipes. The separator row constructs :--- (left), :---: (center), or ---: (right) based on each column's alignment setting. Data rows serialize identically to the header. Tab/shift-tab key events handle cell navigation. Paste events detect tab-separated data and expand it into the grid. CSV import uses a RFC 4180-compliant CSV parser to handle quoted cells with commas.

Technical Stack

2D array table stateGFM pipe table serializerRFC 4180 CSV parserTab-separated paste detectionClient-side only