A premium, modern Chrome extension that automatically generates a beautifully styled Table of Contents sidebar for any long-form article, blog, or documentation page.
- Dynamic Headings Extraction: Automatically scans the page for
H1,H2, andH3tags. - Hierarchical Numbering: Automatically assigns nested numbering (e.g.,
1.,1.1.,1.1.1.) to your headings. - Modern Glassmorphism UI: A vibrant purple color scheme with a blurred, semi-transparent backdrop.
- Smooth Scrolling: Clicking a heading smoothly scrolls you directly to that section, with an intelligent offset to avoid sticky navigation bars.
- Dark Mode Support: Adapts perfectly to your system's dark theme with sleek neon purple accents.
- Clone or download this repository to your computer.
- Open Google Chrome and navigate to
chrome://extensions/. - Enable Developer Mode by toggling the switch in the top right corner.
- Click the Load unpacked button in the top left.
- Select the folder containing these extension files.
- Open any article, and the Table of Contents sidebar will appear automatically on the right side of your screen!
manifest.json: Configuration and metadata for the Chrome extension.content.js: The core logic that parses the DOM, extracts headings, builds the sidebar UI, and handles scroll interactions.styles.css: The premium styling (CSS) for the sidebar, including animations and dark mode media queries.icon.png: The logo for the extension.