ZeroTool Workbench

Markdown TOC Generator

Generate a clickable table of contents from Markdown headings. GitHub, GitLab, Jekyll, and Bitbucket anchor styles. Update in place via <!-- toc --> markers. 100% browser-based.

100% Client-Side Your data never leaves your browser Free · No Sign-Up

Replace TOC inside <!-- toc --> ... <!-- /toc --> markers

Table of contents

Related Tools

Markdown Linter Check Markdown for style and formatting errors in real time. Shows rule IDs, line numbers, and clickable results. Runs entirely in-browser. Markdown Table Generator Build Markdown tables visually — add rows and columns, paste CSV or JSON, then copy the formatted table. Slugify String Convert any text to a URL-friendly slug. Handles Unicode, removes special characters, custom separator support. Markdown Preview Live Markdown editor with real-time HTML preview. Supports GFM tables, task lists, and code blocks. Text Case Converter Convert text to UPPER, lower, Title, camelCase, snake_case, and more. Markdown to Word Converter Convert Markdown to Word (.docx) files instantly. Supports headings, bold/italic, lists, tables, code blocks, and more. Runs entirely in-browser — your document is never uploaded.

How to Use

  1. Paste your Markdown into the input area.
  2. Pick the Anchor style matching your target platform — GitHub / Hugo, GitLab, Jekyll, or Bitbucket.
  3. Adjust Min and Max heading levels to control which headings appear in the TOC.
  4. Toggle Include H1 off if your document title is rendered separately.
  5. Copy the generated TOC, or enable Marker mode to get the full Markdown with the TOC inserted between <!— toc —> markers.

Anchor Styles

The tool ships with four anchor styles. Pick the one that matches your renderer:

  • GitHub / Hugo — lowercase, strip punctuation, hyphenate spaces, keep Unicode letters. Hugo (since v0.62 with goldmark) defaults to the same rules.
  • GitLab — same as GitHub plus consecutive hyphens collapsed into one, matching GitLab Flavored Markdown.
  • Jekyll (kramdown classic) — strips non-ASCII characters before slugifying. Use this only if your Jekyll site has not switched to a Unicode-friendly slugger.
  • Bitbucket — every anchor is prefixed with markdown- and duplicates use _N instead of -N.

Marker Mode

Marker mode keeps your TOC fresh without touching the rest of the document. Wrap the spot you want the TOC to live with two HTML comments:

<!— toc —>
<!— /toc —>

Run the generator any time and the block between the two comments is replaced with a new TOC. If your document has no markers yet, the tool inserts a fresh block right before the first heading and you can commit the result.

Worked Examples

Simple TOC, GitHub style

Input:

# API Reference

## Authentication

### OAuth Flow

## Endpoints

### GET /users
### POST /users

Output (GitHub anchors, 2-space indent):

- [API Reference](#api-reference)
  - [Authentication](#authentication)
    - [OAuth Flow](#oauth-flow)
  - [Endpoints](#endpoints)
    - [GET /users](#get-users)
    - [POST /users](#post-users)

Duplicate headings

Two sections named ## Examples become #examples and #examples-1 on GitHub, GitLab, and Jekyll, or #markdown-examples and #markdown-examples_1 on Bitbucket.

Skipping H1

If your static site renders the H1 from frontmatter, turn off Include H1 so the TOC starts at the first H2 and indentation flattens by one level.

FAQ

Why does the anchor style matter?

Each platform uses its own slugify rules to turn a heading into an anchor. GitHub keeps Unicode and joins spaces with hyphens, GitLab does the same but collapses repeated hyphens, Jekyll/kramdown classic strips non-ASCII, and Bitbucket prefixes every anchor with markdown-. A TOC built with the wrong rules produces dead links.

Does it work with Chinese, Japanese, and Korean headings?

GitHub, GitLab, and Bitbucket preserve Unicode letters in anchors, so Chinese/Japanese/Korean headings work as you expect. Jekyll classic strips non-ASCII characters by default — if your target is Jekyll, switch to GitHub style to keep the original heading text in the URL.

How does the marker mode update an existing TOC?

Turn on Marker mode and the tool searches for <!-- toc --> ... <!-- /toc --> in your Markdown, replaces everything between the markers with the freshly built TOC, and leaves everything else untouched. If no markers exist, it inserts a new TOC block right before the first heading. The original document is regenerated on every change.

What if my document has duplicate headings?

Duplicate slugs are deduplicated automatically. GitHub, GitLab, and Jekyll append -1, -2, -3 … to repeated anchors. Bitbucket uses _1, _2, _3 … to match its native rendering. The TOC links always resolve to a unique target.

Does it skip headings inside code blocks?

Yes. Anything inside fenced code blocks (``` or ~~~) is treated as code — the tool never picks up a leading # as a heading. The same applies to lines inside an existing <!-- toc --> ... <!-- /toc --> block, so you can run the generator repeatedly without nesting old TOCs.