SEOlust logo SEOlust
SEO & On-Page

Table of Contents Generator

Generate a table of contents from HTML or Markdown headings — nested HTML and Markdown output with clean anchor slugs and a live preview. Free, in your browser.

All tools

💡 How to use

  • Paste an article's HTML or Markdown — headings are detected automatically.
  • The anchor links use URL-friendly slugs of each heading.
  • For the links to work, your headings need matching id attributes — most Markdown renderers (like GitHub) add these automatically.

Free Table of Contents Generator

Generate a table of contents from your HTML or Markdown headings in seconds. Paste your content and get a nested TOC as ready-to-use HTML and Markdown, with clean anchor-link slugs and a live preview. Free, runs in your browser, no sign-up.

What is a table of contents and why add one?

A table of contents is a linked outline of a page's headings that lets readers jump straight to the section they want. On long articles and documentation it improves usability and time on page, and it can help search engines understand your content structure — sometimes earning jump-to-section links in the results. Building one by hand is tedious; this tool creates it automatically from your existing headings.

How to use the generator

It is instant:

  • Paste your article as HTML or Markdown — the format is detected automatically.
  • Choose which heading levels to include (for example H2 to H4).
  • Pick a bulleted or numbered list.
  • Copy the HTML or Markdown output, and see a live preview.

How the anchor links work

Each heading becomes a link that points to an id-based anchor, using a URL-friendly slug of the heading text (for example, 'Getting Started' becomes #getting-started). Duplicate headings get numbered slugs so every link is unique. Clicking a TOC link scrolls the page to the matching heading — as long as that heading has the same id on the page.

Making sure the links jump correctly

For the anchors to work, each heading on your page needs an id attribute matching the slug in the TOC. The good news is that most Markdown renderers — including GitHub, GitLab, and many static-site generators and CMSs — automatically add ids derived from the heading text, so a Markdown TOC often just works. For hand-written HTML, add id attributes to your headings (for example, <h2 id="getting-started">), matching the slugs this tool produces.

Choosing which heading levels to include

A good table of contents is a summary, not a mirror of every heading. For most articles, including H2 and H3 gives a clean, scannable outline, while adding H4 and deeper can make the TOC cluttered. Skip H1, since that is usually the page title. Use the level range controls to include exactly the depth that helps readers navigate without overwhelming them.

Pro tip

Place the table of contents near the top of long posts, right after the introduction, so readers see the full scope at a glance. Keep your heading text concise and descriptive — it doubles as both the on-page heading and the TOC link. To tidy the surrounding markup, pair this with our Markdown to HTML Converter and HTML Beautifier.

FAQ

Is this table of contents generator free?
Yes. It is completely free, runs in your browser, and requires no account or sign-up.
Does it work with both HTML and Markdown?
Yes. Paste either format and the tool detects it automatically, extracting your headings and building the TOC as both HTML and Markdown.
Why don't the TOC links jump to the sections?
The links point to id anchors based on each heading's slug. For them to work, your headings need matching id attributes. Most Markdown renderers add these automatically; for raw HTML you may need to add ids yourself.
How are the anchor slugs created?
Each heading's text is lowercased, stripped of punctuation, and spaces are turned into dashes — so 'Getting Started' becomes getting-started. Duplicate headings get a numbered suffix to stay unique.
Which heading levels should I include?
For most articles, H2 and H3 make a clean outline. Adding deeper levels can clutter the TOC, and H1 is usually the page title, so it is typically skipped.
Can I get a numbered table of contents?
Yes. Choose the numbered (ol) list type to output an ordered list instead of bullets.
Is my content kept private?
Yes. Everything is processed locally in your browser, so nothing you paste is uploaded or stored.

Related tools

Pro tip: pair this tool with Trailing Slash Consistency Checker and UTM Builder for a faster SEO workflow.