Want to take your software engineering career to the next level? Join the mailing list for career tips & advice Click here


Web Starter Kit - a workflow for multi-device websites

Star full 4f7b624809470f25b6493d5a7b30d9b9cb905931146e785d67c86ef0c205a402Star full 4f7b624809470f25b6493d5a7b30d9b9cb905931146e785d67c86ef0c205a402Star full 4f7b624809470f25b6493d5a7b30d9b9cb905931146e785d67c86ef0c205a402Star half bd79095782ee4930099175e5ce7f4c89fa3ddabcd56fffcc7c74f6f2a2d46b27Star blank 374f33e4d622a2930833db3cbea26b5d03dc44961a6ecab0b9e13276d97d6682 (2 ratings)
Rated 3.5 out of 5
Subscribe to updates I use web-starter-kit

Statistics on web-starter-kit

Number of watchers on Github 18528
Number of open issues 71
Average time to close an issue 18 days
Main language HTML
Average time to merge a PR 8 days
Open pull requests 48+
Closed pull requests 33+
Last commit almost 3 years ago
Repo Created over 6 years ago
Repo Last Updated 3 months ago
Size 10 MB
Homepage http://developers...
Organization / Authorgoogle
Latest Releasev0.6.5
Page Updated
Do you use web-starter-kit? Leave a review!
View open issues (71)
View web-starter-kit activity
View on github
Book a Mock Interview With Me (Silicon Valley Engineering Leader, 100s of interviews conducted)
Software engineers: It's time to get promoted. Starting NOW! Subscribe to my mailing list and I will equip you with tools, tips and actionable advice to grow in your career.
Evaluating web-starter-kit for your project? Score Explanation
Commits Score (?)
Issues & PR Score (?)

Web Starter Kit


Web Starter Kit is an opinionated boilerplate for web development. Tools for building a great experience across many devices and performance oriented. Helping you to stay productive following the best practices outlined in Google's Web Fundamentals. A solid starting point for both professionals and newcomers to the industry.


Feature Summary
Responsive boilerplate A responsive boilerplate optimized for the multi-screen web. Powered by Material Design Lite. You're free to use either this or a completely clean-slate via basic.html.
Sass support Compile Sass into CSS with ease, bringing support for variables, mixins and more. (Run gulp serve or gulp for production)
Performance optimization Minify and concatenate JavaScript, CSS, HTML and images to help keep your pages lean. (Run gulp to create an optimised version of your project to /dist)
Code Linting JavaScript code linting is done using ESLint - a pluggable linter tool for identifying and reporting on patterns in JavaScript. Web Starter Kit uses ESLint with eslint-config-google, which tries to follow the Google JavaScript style guide.
ES2015 via Babel 6.0 Optional ES2015 support using Babel. To enable ES2015 support remove the line "only": "gulpfile.babel.js", in the .babelrc file. ES2015 source code will be automatically transpiled to ES5 for wide browser support.
Built-in HTTP Server A built-in server for previewing your site locally while you develop and iterate
Live Browser Reloading Reload the browser in real-time anytime an edit is made without the need for an extension. (Run gulp serve and edit your files)
Cross-device Synchronization Synchronize clicks, scrolls, forms and live-reload across multiple devices as you edit your project. Powered by BrowserSync. (Run gulp serve and open up the IP provided on other devices on your network)
Offline support Thanks to our baked in Service Worker pre-caching, sites deploying dist to a HTTPS domain will enjoy offline support. This is made possible by sw-precache.
PageSpeed Insights Web performance metrics showing how well your site performs on mobile and desktop (Run gulp pagespeed)


Download the kit or clone this repository and build on what is included in the app directory.

There are two HTML starting points, from which you can choose:

  • index.html - the default starting point, containing Material Design layout.
  • basic.html - no layout, but still includes our minimal mobile best-practices

Be sure to look over the installation docs to verify your environment is prepared to run WSK. Once you have verified that your system can run WSK, check out the commands available to get started.

Web Performance

Web Starter Kit strives to give you a high performance starting point out of the box. Our median Web Page Test scores for the default template have a Speed Index of ~1100 (1000 is ideal) and a repeat-visit Speed Index of ~550 thanks to Service Worker precaching.

Browser Support

At present, we officially aim to support the last two versions of the following browsers:

  • Chrome
  • Edge
  • Firefox
  • Safari
  • Opera
  • Internet Explorer 9+

This is not to say that Web Starter Kit cannot be used in browsers older than those reflected, but merely that our focus will be on ensuring our layouts work great in the above.


If you find yourself running into issues during installation or running the tools, please check our Troubleshooting guide and then open an issue. We would be happy to discuss how they can be solved.

A Boilerplate-only Option

If you would prefer not to use any of our tooling, delete the following files from the project: package.json, gulpfile.babel.js and .travis.yml. You can now safely use the boilerplate with an alternative build-system or no build-system at all if you choose.

Docs and Recipes


Web Starter Kit is inspired by Mobile HTML5 Boilerplate and Yeoman's generator-gulp-webapp, having taken input from contributors to both projects during development. Our FAQs attempt to answer commonly asked questions about the project.


Contributions, questions and comments are all welcome and encouraged. For code contributions to Web Starter Kit, please see our Contribution guide before submitting a pull request. Website related issues should be filed on the Web Fundamentals issue tracker.


Apache 2.0
Copyright 2015 Google Inc

web-starter-kit open issues Ask a question     (View All Issues)
  • about 4 years consider clearing cache in clean task
  • about 4 years Import from NPM/Bower
  • about 4 years The kit works, but...
  • about 4 years UPDATE http://google.github.io/web-starter-kit/hello-world/
  • about 4 years gulp serve "Working directory changed to" issue
  • about 4 years Add HTML partial support
  • about 4 years Failed to load external module babel-register
  • about 4 years Example code uses old version of Material Design Lite
  • about 4 years Babel Core ^6.0.0 - Unexpected token import
  • about 4 years Update Google Analytics snippet
  • over 4 years Feature: Swap out Gulp for a Module Bundler
  • over 4 years Integrate `stylelint` for linting styles
  • over 4 years The right way to do localization?
  • over 4 years Problem with uncss + mdl-sass
  • over 4 years Default index.html navbar and button being overlapped
  • over 4 years Add official generator for Yeoman
  • over 4 years .tmp directory permissions issue
  • over 4 years Sourcemaps not working after gulp serve
  • over 4 years gulpfile: scripts task: multiple script files
  • over 4 years WSK Example
  • over 4 years rollup + babel on WSK2
  • over 4 years Error with 'gulp deploy' task?
  • over 4 years MDL: Why do you have to reference the same set of source files twice?
  • over 4 years Windows installation fails due to missing VCBuild.exe
  • almost 5 years Inline JS is not being minified
  • almost 5 years Nav link act like tab link for single page apps?
  • almost 5 years Unexpected token import
  • almost 5 years fsevents doesn't install on linux
  • about 5 years node-sass installation
  • about 5 years main.scss @font-face url error
web-starter-kit open pull requests (View All Pulls)
  • Minify inline
  • Update copyright year
  • Avoiding grep
  • Inject css styles instead of reloading page for local server
  • add htmlhint to lint html files
  • Fix typos
  • Browsersync
  • Try to fix issue #848
  • Wsk2 babel rollup
  • Prevent useref from outputting main.min.js (Closes #848)
  • Fix consistency with every other paths
  • Updated dependencies
  • add node6
  • Malformed code
  • live browser reloading on js files is missing
  • Add Firebase login command to deploy docs.
  • README: remove unused file
  • Add nodejs 6 to travis.
  • Update dependencies.
  • chore(mdl): Use MDL 1.2.1
  • HTML partial support
  • Break long line in gulpfile into smaller lines
  • amaze ui source code
  • Add main.js to alternative starting point page
  • Added smooth scroll
  • Copy edits
  • Add CDNJS badge in readme
  • useref simplified (issue #913)
  • fix Unexpected token import #882
  • Swapping sw-toolbox and sw-precache for workbox-sw and workbox-build
  • [refs #935] Add nunjucks templating engine
  • Add npm scripts for start, build, lint, etc. - fixes #903
  • Fixed a link in app/index.html
  • Wsk next
  • Updates
  • Create Updates
  • New thing
  • Update deploy-firebase.md
  • Upgraded dependencies
  • Update Node Version tested for and allowed - Resolves #950
  • Compile SASS files in addition to CSS and SCSS files
  • Bump deap from 1.0.0 to 1.0.1
  • Bump handlebars from 4.0.6 to 4.5.3
  • Update readme.md
  • Libraries Update
  • adding readme file
  • Added an image to improve website header
  • Ability to minify internal JS and CSS.
web-starter-kit questions on Stackoverflow (View All Questions)
  • Google Web Starter Kit - JShint gives error with new Javascript file
  • Putting together Google Web Starter Kit & Expressjs?
  • Installing Google Web Starter Kit takes forever
  • Google web starter kit gulp serve error
  • How to use (not install) Google Web Starter Kit?
  • I want to use Google Web Starter Kit. Can I use Django to plug data into the web page?
  • How to use the hamburger menu on Android with Web Starter Kit?
  • Best practise for integration of Google's Web Starter Kit with AppEngine/Jinja2
  • Web Starter Kit SASS not compiling
  • Web starter kit installation Error
  • Web starter kit & php
  • Google web starter kit and nginx
  • Make Google's Web Starter Kit Gulpfile Livereload SCSS Imports
  • Insert jquery on web starter kit
  • Web Starter Kit - where to write sass?
  • How to incorporate Google's Web Starter Kit in a Middleman project?
  • Google Web Starter Kit not installing correctly
  • Issue getting started with Google Web Starter Kit
  • Web Starter Kit and Gulpfile's unknown points
  • Setting up Bower with Gulp (and Web Starter Kit)
  • How to include AngularJS file in grunt build with web starter kit
  • Why are there no forms in the Visual Style Guide of Web Starter Kit?
  • Web starter kit gulp error on first install
  • Web Starter Kit - Adding fonts
  • Getting error using BrowserSync with Web Starter Kit
  • Can't link to my bower_components folder using google web-starter-kit
  • Google's Web Starter Kit error running gulp in git bash command line terminal
  • Google Web Starter Kit implementation in Fat-Free framework
  • Using sass source maps in web-starter-kit
  • Google Web Starter Kit responsive navigation
web-starter-kit list of languages used
web-starter-kit latest release notes
v0.6.5 v0.6.5

This is a maintenance release of Web Starter Kit Download it here

v0.6.4 0.6.4

Download the latest release here.

v0.6.3 Web Starter Kit 0.6.3

This is a maintenance release of Web Starter Kit Download it here

  • Multiple fixes to Service Worker setup
  • Regression fix: avoid generating scripts a level-up from project root
Other projects in HTML
Powered by Autocode - Instant Webhooks, Scripts and APIs
Autocode logo wordmark