CodyHouse Framework + Components are featured on Product Hunt! Join the discussion →


Progress value is 30%

Table of Contents

A navigation with a list of links to the main sections of the page.

Copy: View demo


All components are built upon the CodyHouse Framework.

If you're using this component, you should also include the SCSS/JS of the following components:

How to

The Table of Contents component is used to display a secondary navigation. It includes links to the main sections of the page. It's often referred to as "on this page", or "content" navigation.

The TOC becomes visible past the 'medium' breakpoint. To modify this behavior, edit the [email protected] utility class applied to the component.

To connect each navigation link to the appropriate section, make sure the href value of the link is equal to the ID of the target section.

The TOC in the demo is sticky because of the .toc--sticky class applied to it. The class sets position: sticky for the component, so that is doesn't scroll with the content. 


  • ✅ Component created
    🗓 September 12, 2019

Bug Report & Feedback

Get in touch: suggest a component or report a bug.

✅ Project duplicated

✅ Project created

There was an error while trying to export your project. Please try again or contact us