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


Progress value is 30%

Side Navigation

Vertical side navigation template.

Copy: View demo


All components are built upon the CodyHouse Framework.

This component includes variations. All variations share the same SCSS/JS code. They only differ in the HTML part.

How to

The Side Navigation is a vertical, secondary navigation component.

The component includes the option to display sub lists, whose visibility is controlled by the .sidenav__sublist-control button. If you don't plan on adding sub-lists, use the --basic variation.

To remove the icons, delete the inline SVG .icon elements.

Important: this component does not include responsive behavior because it's just a piece of the sidebar. The parent of the Side Navigation (<aside>) is just a wrapper used for demo purpose. The navigations adapts to fit the width of its parent.

⭐️ Demo icons by Nucleo.


  • ✅ Component created
    🗓 September 25, 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