Guide · Open source

How to use html5-boilerplate: install, run and customise

Updated 2026-10-29 · written with AI from the project's own documentation and checked against our catalogue data

HTML5 Boilerplate is a free, MIT-licensed front-end template: a set of ready-made HTML, CSS and JavaScript files that give a new website a sensible starting point. It suits developers who want a tested baseline without committing to a framework. By the end of this guide you will be able to create a new site from the README commands, run it locally and know which parts you can strip out.

HTML5 Boilerplateh5bp/html5-boilerplate · ★ 57.7k · MIT Install options & downloads

Quick start

1Check prerequisites. Install Node.js and npm, since the README commands depend on them.
2Create the site. Run npx create-html5-boilerplate new-site to create a folder called new-site.
3Enter the folder. Change into new-site with cd new-site.
4Install dependencies. Run npm install inside the new site folder.
5Start the project. Run npm run start to launch the project.
6Edit and strip down. Replace the placeholder meta tags and remove any files or parts you do not need.

What you need before you start

You need Node.js and npm installed. The README's install commands use npx and npm, so both must be available on your computer.

HTML5 Boilerplate is a set of code files, not a visual website builder. You will edit HTML, CSS and JavaScript yourself.

Node.js and npm
A code editor
Basic familiarity with HTML and CSS

Create a new site with create-html5-boilerplate

The quickest route is the create-html5-boilerplate script. Running npx with the name new-site installs the latest version into a folder called new-site, without installing anything into your current project first.

The README also lists other options: the Template Repository on GitHub, installing the html5-boilerplate package with npm or yarn, or downloading the latest stable release as a zip file.

npx create-html5-boilerplate new-site
cd new-site
npm install
npm run start

Understand what you get in the folder

The project you publish is the contents of the dist folder. If you install with npm, the resulting node_modules/html5-boilerplate/dist folder holds the latest version for end users, and you may need to copy its contents into your project directory.

The bundled package.json includes example WebPack commands. The README describes these as an example to jumpstart development, so you can change or remove them.

dist: the published project files
package.json: example WebPack commands built in
docs/TOC.md: bundled documentation for offline reading

Use the built-in starter features

The template includes placeholder Open Graph elements and meta tags, placeholder CSS media queries, useful CSS helper classes and default print styles that are performance optimised.

The README calls the template Delete-key friendly, meaning you can strip out parts you do not need. Keep the pieces you use and remove the rest.

Placeholder Open Graph elements and attributes
Placeholder CSS media queries
Useful CSS helper classes
Default print styles

Check browser support before you rely on it

HTML5 Boilerplate supports the latest, stable releases of all major browsers. The README points to the default configuration of Browserslist for the exact browsers and versions covered.

If you need to target older browsers, check that Browserslist list first and test your own site.

What people use it for

Starting a new static website with a tested HTML, CSS and JavaScript baseline
Adding placeholder Open Graph and meta tags to a site without writing them from scratch
Building on CSS helper classes and media query placeholders in a custom design
Creating a site without choosing a framework up front

Frequently asked questions

Is html5-boilerplate free to use?

Yes. The code is available under the MIT license, as stated in the README's License section. Check the LICENSE.txt file in the repository for the full terms.

What do I need to install html5-boilerplate?

The README lists Node.js and npm as the prerequisites, because the create-html5-boilerplate, npm install and npm run start commands depend on them.

Is HTML5 Boilerplate a framework?

No. The README says it does not impose a specific development philosophy or framework, so you can structure your code as you want. If you need components and routing, a framework is a better fit.

Can I use HTML5 Boilerplate without npm?

The README also lists a zip download of the latest stable release. You unzip it into a folder, which means you can start without running npm commands, though you will not get the npm-based setup.

How does html5-boilerplate compare to Bootstrap or Tailwind CSS?

Bootstrap, Tailwind CSS, Skeleton and Milligram are the comparable projects listed for this item. HTML5 Boilerplate is a starting template with HTML, CSS and JavaScript files and helpers, rather than a component library, so compare them by what each one provides for your project.

Can I remove parts of html5-boilerplate I do not need?

Yes. The README describes the template as Delete-key friendly, which means it is easy to strip out parts you don't need. The bundled WebPack setup is only an example, so you can replace it if your project needs a different build tool.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use HTML5 Boilerplate if you are starting a new static website and want a tested, framework-neutral baseline with placeholder meta tags and CSS helpers. Pick something else if you want a complete framework with components and routing, a visual website builder, or a project locked to a specific build tool.

Install options & downloads