Automatically build a table of contents from HTML headings like h1, h2, h3… with Init TOC Generator 2.0. Export as HTML lists (UL/OL), Markdown, or plain-text outline. Unique id generation, Vietnamese-friendly slugs, no plugins, no installs.
Introduction
Init TOC Generator is an online tool that creates a Table of Contents from HTML content using <h1> through <h6>. It’s perfect for long-form posts, technical docs, and blogs that need clear navigation — everything runs in the browser without altering your original layout.
Great for:
- Technical writers and documentation authors
- Long-form blog posts that need a navigable outline
- Notion, Docs, and GitHub users who want a Markdown TOC
Main Features
- Auto-detect all headings from
h1toh6 - Level normalization so the TOC is aligned and easy to read (anchors to the smallest level in your content)
- Multiple export formats: HTML
<ul>/<ol>, Markdown, or Plain (numbered outline 1., 1.1., 1.1.1.) - Vietnamese-aware slugging (removes diacritics, converts “đ” → “d”), with de-dup by appending
-2,-3, … - Auto-attach
idto headings if missing (safe, won’t break styles); preserves existingids - Flexible exclusion: add
.no-tocordata-toc="false"on a heading to skip it - Custom TOC label via
data-toc-title="Short label"(doesn’t change the actual heading text) - Multilingual support, tuned for Vietnamese content
- No content formatting loss: reads headings only and leaves the rest of your HTML intact
- Light/Dark mode friendly to match your site UI
- Fully client-side, no data leaves your browser
How to Use
- Open the tool on Init HTML
- Paste or write HTML content that includes
h1–h6headings - Choose your output format: HTML UL/OL, Markdown, or Plain (outline)
- Click “Generate TOC”
- Copy the generated TOC and use it anywhere; you can edit headings and regenerate instantly
Pro tip: want a shorter label only in the TOC? Add data-toc-title to that heading. Need to exclude a heading? Add no-toc or data-toc="false".
Performance & SEO
Init TOC Generator uses the Trumbowyg editor and UIkit UI for a lightweight, smooth experience—even on low-spec devices. The TOC mirrors your content precisely and doesn’t inject extra scripts or styles, keeping HTML clean, SEO-friendly, and fast to load.
Everything runs client-side; no data is sent to any server, ensuring complete privacy.
Why Init TOC Generator?
Compared to heavy TOC plugins or hard-to-control scripts, this tool:
- Works instantly and is platform-agnostic
- Respects heading structure with correct nested lists
- Fully supports Markdown and numbered outlines—ideal for technical docs
Init TOC Generator is a simple yet powerful way to produce clear, well-leveled, easy-to-use tables of contents for any type of content.
