Library / SDK
h5bp/html5-boilerplate avatar
h5bp/html5-boilerplate

HTML5 Boilerplate v9: A Starter Template That Still Earns Its Place

HTML5 Boilerplate is a professional front-end template for fast, robust, adaptable sites, distilling over ten years of community knowledge without imposing a framework.

57,678 stars12,233 forksJavaScriptMIT

At a glance

What is it?
HTML5 Boilerplate is a front-end template that bundles battle-tested defaults for HTML, CSS, and JavaScript. It does not impose a framework, but its build tooling and browser-support choices deserve a closer look before you adopt it.
Who is it for?
Adopt HTML5 Boilerplate if you want a lean, framework-agnostic starting point for a static site or a small web app, and you are comfortable copying files from the dist folder or using the npm package. Do not use it if you need a full build pipeline with hot reloading out of the box, or if your team expects a component-based architecture.
Can I use it commercially?
Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
Is it still maintained?
Yes. The repository last received commits 1 day ago.
What is it written in?
Mainly JavaScript, according to GitHub's language statistics.

Answers come from the project's GitHub data, last synced on November 13, 2026, and from our analysis. They are not legal advice.

From daily snapshots

Star history

  • h5bp/html5-boilerplate57,678 ★ · +106
Star history
Repository2026-07-282026-11-13
h5bp/html5-boilerplate57.6k57.7k

106 Stars in the last 108 days, measured from the daily GitHub snapshot. Compare with other projects

Editorial analysis

What Problem It Solves and Who It Is For

HTML5 Boilerplate solves a specific annoyance: every new static website starts with the same tedious setup. You need a doctype, a viewport meta tag, a normalizer for browser inconsistencies, a print stylesheet, and a folder structure that does not collapse the first time you deploy. This project packages a decade of accumulated knowledge into a single download. It targets developers who want a professional baseline without adopting a framework. The README is explicit that it does not impose a development philosophy. That makes it suitable for freelancers, small agencies, and internal tools where the team wants to own the architecture. It is less useful for teams already committed to React, Vue, or Angular, because those ecosystems bring their own scaffolding. The template is a starting point, not a runtime. You are expected to delete what you do not need, and the README calls it 'delete-key friendly.'

How the Repository Is Structured and What You Actually Get

The repository has a clear split between authoring and publishing. The gulpfile.mjs exists only to build the project, and the README warns you not to clone the repository to start a site. The published artifact is the dist folder. That distinction matters. When you install via npm, you get node_modules/html5-boilerplate/dist, which is the template you copy into your project. The index.html ships with placeholder Open Graph elements, which is a small but useful touch for social sharing. The CSS includes helper classes, default print styles, and placeholder media queries. The key point is that the template is static. There is no server-side rendering, no routing, and no state management. You get a starting point that works with any backend or static host.

Getting It Running: Commands and Config Keys

The quick start is straightforward. The recommended path is the create script. Run npx create-html5-boilerplate new-site, then cd into the folder, run npm install, and finally npm run start. That command sequence comes directly from the README. If you prefer npm or yarn, you can install the package itself with npm install html5-boilerplate or yarn add html5-boilerplate, and then copy the dist folder into your project. There is also a GitHub template repository that lets you create a new repository from the latest code without local installation. The npm package includes an example package.json with Webpack commands built in. The README does not list those commands, so you would need to inspect the generated package.json to see exactly what they are. The Browserslist configuration is set to the 'defaults' query, which covers the latest stable releases of all major browsers. You can adjust that in your own project, but the template ships with that baseline.

Where the Template Shows Its Age: Build Tooling and Flexibility

The most obvious limitation is the build tooling. The README mentions Webpack commands in the example package.json, but it does not describe a modern dev server with hot module replacement or a production bundling pipeline. In 2024, many developers expect a zero-config build process. HTML5 Boilerplate is not that. It is a static template. You are expected to add your own build tools if you need them. The README even says the gulpfile.mjs is for producing the project, not for your use. For a simple site that does not need a build step, that is fine. For a complex app, you will spend time configuring tooling that a framework starter would give you for free. Another limitation is browser support. The 'defaults' Browserslist query is reasonable, but it does not include legacy browsers. If you need to support Internet Explorer or older Safari, this template will not hold your hand. You will have to adjust the configuration and likely add polyfills yourself.

A Genuine Alternative: create-react-app and the Framework Approach

The closest alternative is create-react-app, which is a scaffold for React applications. The difference is fundamental. create-react-app gives you a running application with a component model, a dev server, and a production build script. HTML5 Boilerplate gives you a static HTML file and a folder structure. If you want to build a single-page application, create-react-app is the faster path because it handles state, routing, and component compilation. HTML5 Boilerplate is the better choice if you want to write vanilla JavaScript or use a lightweight library like Alpine.js, because it does not impose a component model. The trade-off is that create-react-app locks you into React and its tooling, while HTML5 Boilerplate leaves you free to choose. The README makes this explicit: it does not impose a development philosophy. That freedom is valuable, but it comes with responsibility. You have to make the architectural decisions that a framework would make for you.

Maintenance, Upgrade Cost, and License

The project is maintained. The last push was on 2026-11-01, and the latest release, version 9.0.1, dates from April 2024. The history shows a long evolution, with v8.0.0 in 2020 and v9.0.0 in late 2023. That cadence suggests the template does not change often, which is a sign of stability. The upgrade cost is low because the template is static. To upgrade, you download the new dist folder and compare it with your current files. The README does not provide a migration guide, so you are on your own for that comparison. The license is MIT, which means you can use it in commercial projects without restriction, but you are responsible for any modifications you make. The template itself is small, so the maintenance burden is mostly about keeping your own dependencies up to date, such as the Webpack version in the example package.json. That is a real cost, but it is not unique to this project. The documentation is bundled with the project, which is a nice touch for offline reference and for teams that want to write their own docs on top of it.

The Verdict: A Solid Foundation, Not a Solution

HTML5 Boilerplate is exactly what it claims to be: a professional starting point. It does not try to be a framework, and that is its strength. The template gives you sensible defaults for HTML, CSS, and JavaScript, and it leaves the architecture to you. The quick start is simple, the license is permissive, and the project has a long history of community input. The weaknesses are clear. There is no component model, and the build tooling is limited to the example package.json with its Webpack commands. You have to add anything beyond that yourself. For a static marketing site or a small web app, that is a reasonable trade-off. For a large application, you will likely spend more time configuring tooling than writing code. If you know what you are doing, this template can save you hours of setup. If you are new to front-end development, a framework starter might be a gentler introduction. The decision comes down to whether you want a template or a framework. This project is unapologetically the former.

Editorial conclusion

Adopt HTML5 Boilerplate if you want a lean, framework-agnostic starting point for a static site or a small web app, and you are comfortable copying files from the dist folder or using the npm package. Do not use it if you need a full build pipeline with hot reloading out of the box, or if your team expects a component-based architecture. Before adopting, verify that the Browserslist 'defaults' range matches your target audience, and check the bundled package.json to see whether the Webpack commands fit your workflow. The template is a solid foundation, but it is not a framework and it will not make those decisions for you.

Frequently asked questions

what is html5 boilerplate

HTML5 Boilerplate is a professional front-end template for building web apps or sites, the product of over 10 years of iterative development and community knowledge from more than 200 contributors. It does not impose a specific development philosophy or framework, so you are free to architect your code as you want.

how to use html5 boilerplate

Run npx create-html5-boilerplate new-site, then cd new-site, npm install, and npm run start. Alternatively install with npm install html5-boilerplate or yarn add html5-boilerplate, then copy the contents of the node_modules/html5-boilerplate/dist folder into your project directory.

what is html5 boilerplate used for

It is a starter template for a website or application. It includes placeholder Open Graph elements and attributes, an example package.json file with WebPack commands built in, placeholder CSS Media Queries, useful CSS helper classes, default print styles, and extensive documentation.

Is boilerplate code good or bad?

The project positions itself as a finely-tuned starter rather than a framework, describing itself as delete-key friendly and easy to strip out parts you do not need. It is designed with progressive enhancement in mind, and what you actually consume is the dist folder, so the parts you disagree with can be removed rather than fought.

What is HTML boilerplate code?

The project you publish is represented by the contents of the /dist/ folder, and everything else in the repository is used to author it. Tools such as the gulpfile.mjs script build the project and are not part of it, so cloning the repository to start a new site is not the intended use.

Official sources

  1. Official documentation
  2. Official README
  3. Project repository
  4. Release notes
Add this badge to your README

If you maintain this project, the badge below links readers to this analysis and shows its maintenance status from the daily GitHub snapshot. Paste the markdown into your README; add ?metric=license or ?metric=stars to the image URL for a different field.

Add this badge to your README

markdown
[![Hysen Labs](https://hysenlabs.com/badge/h5bp-html5-boilerplate.svg)](https://hysenlabs.com/projects/h5bp-html5-boilerplate)

Star history chart for your README

markdown
[![Star history](https://hysenlabs.com/chart/h5bp-html5-boilerplate.svg)](https://hysenlabs.com/projects/h5bp-html5-boilerplate)

Was this useful?