Provides a toggleable off-canvas sidebar navigation layout
HTMLStarter
startbootstrap-simple-sidebar — HTML Starter Template
By StartBootstrap
A Bootstrap sidebar navigation HTML template from Start Bootstrap, with a sidebar that collapses into an off-canvas form, used to build page skeletons with side navigation.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Desktop homepage1 / 2
Desktop captureTop of page
Actual screenshot captured by the server browser.
All pages & views 2
Screenshots show visual appearance; interactive behavior may differ.
Recorded 2026-09-30View source
What stands out
A quick read of the recorded project description.
The dist directory contains directly editable HTML and CSS files
Source code uses Pug, SCSS, and JavaScript, with npm build scripts provided
Live preview in the browser with automatic refresh via npm start
Code released under the MIT license, usable for commercial projects
Template Details
This is a Bootstrap-based HTML starter template whose core is a toggleable off-canvas sidebar navigation. The page body and sidebar are laid out side by side, and a button toggles the sidebar's visibility, making it suitable as a structural starting point for admin, documentation, or tool pages.
The template provides finished HTML and CSS files in the dist directory that can be edited directly; opening index.html in a browser previews it. The repository also keeps src source code, including Pug templates, SCSS, and JavaScript, along with npm build scripts that compile output to dist. Using the build process requires npm installed locally.
The template code is released under the MIT license and can be used, modified, commercialized, and distributed for free; copyright and license notices must be retained when distributing. Third-party assets such as images, fonts, and icons appearing in the demo need their licenses checked separately, and external services such as domains and hosting may incur costs.
HTMLStarter
Is it right for your project?
Use Cases
- Building a side navigation skeleton for admin or tool pages
- Adding a collapsible sidebar menu to documentation or example sites
- As practice material for learning Bootstrap layout and off-canvas interaction
- Quickly introducing a sidebar structure into an existing HTML project
Suitable For
- HTML projects that need a ready-made sidebar navigation structure
- Front-end developers who can directly edit HTML/CSS
- Developers who want to manage source code with an npm build process
- Teams that need an MIT-licensed template for commercial projects
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
Direct use: after downloading, edit the HTML and CSS in the dist directory, and open index.html in a browser to preview
- 2
npm install: run npm i startbootstrap-simple-sidebar
- 3
Clone repository: git clone https://github.com/StartBootstrap/startbootstrap-simple-sidebar.git
- 4
Source build: in the repository root, run npm install, then run npm start to launch local preview and file watching
- 5
Build scripts include npm run build, build:pug, build:scss, build:scripts, clean, etc.; npm must be installed before use
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis entry covers the free version under the MIT license in the public repository; the free scope is the code of that version and does not mean external services or third-party assets are free.
Must comply with when using
- The code of this version may be used, modified, commercialized, and distributed for free.
- When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
- The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.
Additional costs & items to verify
- Using the source build process (npm install, npm start, npm run build, etc.) requires npm installed locally; editing only the HTML/CSS in the dist directory does not require npm.
- The MIT license covers only the template code; the README does not grant licenses for third-party assets such as images, fonts, and icons appearing in the demo, and these assets need their authorization verified separately.
- Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
- External services such as domains, hosting, databases, payments, or AI may incur additional charges.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
You must have npm installed in order to use this build environment.
Original README
https://github.com/StartBootstrap/startbootstrap-simple-sidebar/blob/master/LICENSEhttps://github.com/StartBootstrap/startbootstrap-simple-sidebar/blob/master/README.mdAll of the free templates and themes on Start Bootstrap are released under the MIT license
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-01. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.
Project checks & description sources
Template Information
- Source platforms
- Start Bootstrap
- Documentation and maintenance reference score
- More documented · 80 / 100
- Technologies
- HTML
- Website type
- Starter
How this score is calculated
Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.
What to verify for this project
- Repository update recorded
- 2023-05-24
- Screenshot last checked
- 2026-10-01
A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.
The catalog identifies HTML as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.
Use a selection guide →How this description was prepared
AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.
Automatically checked against source and license rules; no manual editorial review.
Inspect the recorded source material
SHA-256: 64cb117ff30d2d05d4ecd3c12497879696ee8a7619bafff900f8f619283c946f
2026-10-01T13:42:04.296Z
Source file / repository# [Start Bootstrap - Simple Sidebar](https://startbootstrap.com/template/simple-sidebar/) [Simple Sidebar](https://startbootstrap.com/template/simple-sidebar/) is an off canvas sidebar navigation template for [Bootstrap](https://getbootstrap.com/) created by [Start Bootstrap](https://startbootstrap.com/). ## Preview [](https://startbootstrap.github.io/startbootstrap-simple-sidebar/) **[View Live Preview](https://startbootstrap.github.io/startbootstrap-simple-sidebar/)** ## Status [](https://raw.githubusercontent.com/StartBootstrap/startbootstrap-simple-sidebar/master/LICENSE) [](https://www.npmjs.com/package/startbootstrap-simple-sidebar) ## Download and Installation To begin using this template, choose one of the following options to get started: * [Download the latest release on Start Bootstrap](https://startbootstrap.com/template/simple-sidebar/) * Install via npm: `npm i startbootstrap-simple-sidebar` * Clone the repo: `git clone https://github.com/StartBootstrap/startbootstrap-simple-sidebar.git` * [Fork, Clone, or Download on GitHub](https://github.com/StartBootstrap/startbootstrap-simple-sidebar) ## Usage ### Basic Usage After downloading, simply edit the HTML and CSS files included with `dist` directory. These are the only files you need to worry about, you can ignore everything else! To preview the changes you make to the code, you can open the `index.html` file in your web browser. ### Advanced Usage Clone the source files of the theme and navigate into the theme's root directory. Run `npm install` and then run `npm start` which will open up a preview of the template in your default browser, watch for changes to core template files, and live reload the browser when changes are saved. You can view the `package.json` file to see which scripts are included. #### npm Scripts * `npm run build` builds the project - this builds assets, HTML, JS, and CSS into `dist` * `npm run build:assets` copies the files in the `src/assets/` directory into `dist` * `npm run build:pug` compiles the Pug located in the `src/pug/` directory into `dist` * `npm run build:scripts` brings the `src/js/scripts.js` file into `dist` * `npm run build:scss` compiles the SCSS files located in the `src/scss/` directory into `dist` * `npm run clean` deletes the `dist` directory to prepare for rebuilding the project * `npm run start:debug` runs the project in debug mode * `npm start` or `npm run start` runs the project, launches a live preview in your default browser, and watches for changes made to files in `src` You must have npm installed in order to use this build environment. ## Bugs and Issues Have a bug or an issue with this template? [Open a new issue](https://github.com/StartBootstrap/startbootstrap-simple-sidebar/issues) here on GitHub or leave a comment on the [template overview page at Start Bootstrap](https://startbootstrap.com/template/simple-sidebar/). ## About Start Bootstrap is an open source library of free Bootstrap templates and themes. All of the free templates and themes on Start Bootstrap are released under the MIT license, which means you can use them for any purpose, even for commercial projects. * <https://startbootstrap.com> * <https://twitter.com/SBootstrap> Start Bootstrap was created by and is maintained by **[David Miller](https://davidmiller.io/)**. * <https://davidmiller.io> * <https://twitter.com/davidmillerhere> * <https://github.com/davidtmiller> Start Bootstrap is based on the [Bootstrap](https://getbootstrap.com/) framework created by [Mark Otto](https://twitter.com/mdo) and [Jacob Thorton](https://twitter.com/fat). ## Copyright and License Copyright 2013-2023 Start Bootstrap LLC. Code released under the [MIT](https://github.com/StartBootstrap/startbootstrap-simple-sidebar/blob/master/LICENSE) license.
Explore similar templates
Compare previews and descriptions within the same stack and category.
adminkit
AdminKit is a free, MIT-licensed HTML admin and dashboard template built on Bootstrap 5. The free version includes 15 demo pages, 1 plugin, and 1 color scheme, with hundreds of UI components, forms, tables, charts, and icons.
HTML · Admin dashboard
Landing-Page
A general-purpose landing page HTML template maintained by Tailwind Toolbox, written in pure HTML and loading the complete Tailwind CSS via CDN.
HTML · Corporate Website
light-bootstrap-dashboard
Light Bootstrap Dashboard is a free, MIT-licensed admin dashboard template from Creative Tim, built on Bootstrap with a responsive static HTML structure.
HTML · Admin dashboard
sing-app
Sing App Lite is a free, open-source admin dashboard template from Flatlogic, built with Bootstrap 4.5 and SCSS. It provides a responsive layout, dashboard examples, typography, tables, notifications, basic charts, icons, maps, and a hover sidebar, along with styled Bootstrap components.
HTML · Admin dashboard
startbootstrap-modern-business
Modern Business is a multipurpose Bootstrap full-site HTML template from Start Bootstrap with 17 standalone pages covering home, about, services, portfolio, pricing, blog, FAQ, and contact.
HTML · Starter
frontend-webpack-boilerplate
A Webpack 5 starter template for static front-end projects using HTML as the entry point. It preconfigures SASS/PostCSS, Babel, browser-sync development server, and code linting, with separate development and production builds.
HTML · Starter