Tables

GFM pipe tables render with horizontal scrolling on narrow screens, alternating row backgrounds, and per-column alignment. Every example below shows the rendered table first, then the exact Markdown that produces it, so you can copy the syntax straight into your own page. For a richer feature matrix with tick and cross icons, use the ComparisonTable component instead.

Quick Start

A header row, a divider row of dashes, then one row per record.

| Feature           | Status    |
| ----------------- | --------- |
| MDX Support       | Available |
| Code Highlighting | Available |

Almost everything here is optional padding. The outer pipes can go, the cells need not line up, and a single dash is enough of a divider:

Feature | Status
-|-
MDX Support | Available

That parses identically. Prettier pads the cells and adds the outer pipes when you save, which is why every live example on this page looks tidy.

Adding Options

Put a colon in the divider row to align a column: :--- left, :---: center, ---: right.

| Feature           |  Status   |   Description |
| :---------------- | :-------: | ------------: |
| MDX Support       | Available |   Full MDX v3 |
| Code Highlighting | Available | 65+ languages |
| Mermaid Diagrams  | Available |     15+ types |

Alignment is set once per column in the divider row. A cell can't override it.

Advanced

Inline Markdown in cells

Cells accept anything inline: bold text, code spans, links, strikethrough. To put a literal pipe inside a cell, escape it as \|, and keep the backslash even when the pipe sits inside a code span.

| Setting        | Default  | Notes                                        |
| :------------- | :------- | :------------------------------------------- |
| `ACCESS_MODE`  | `public` | Set to `private` to turn on the login gate   |
| `theme`        | `system` | One of `light` \| `dark` \| `system`         |
| ~~`legacy`~~   | —        | Removed in v2                                |
| **Search key** | `Cmd+K`  | See [Lists](/features/markdown/lists) nearby |

Block content has no place here. Lists, code fences, and headings inside a cell won't render, so keep each cell to a single line and link out when a value needs more explanation. Wide tables scroll sideways rather than squashing the columns.

Header-only tables

Drop the body rows and you still get a table: one header row, one divider row, nothing else.

| Column A | Column B |
| -------- | -------- |

Ragged rows

The header row fixes the column count. A short row is padded with empty cells, a long one has the extras thrown away, and neither case is an error. Prettier mangles ragged rows on save, so this one stays in a plain fence:

| a | b | c |
| - | - | - |
| 1 |               renders as 1, empty, empty
| 1 | 2 | 3 | 4 |   renders as 1, 2, 3 — the fourth cell is dropped

Keep every row at the header's width and none of this comes up.

Tables inside other blocks

A table needs no blank line before it, so it can follow a paragraph directly. It also nests inside a list item or a blockquote as long as every line carries the indent or the >.

• Supported access modes

  Mode	Login gate
  public	Off
  private	On

Route	Method
/api/mcp	POST
/api/auth	POST

- Supported access modes
 
  | Mode      | Login gate |
  | --------- | ---------- |
  | `public`  | Off        |
  | `private` | On         |
 
> | Route       | Method |
> | ----------- | ------ |
> | `/api/mcp`  | POST   |
> | `/api/auth` | POST   |

Options

GFM tables have no props to configure. The divider row carries every control you get.