BootMetro Documentation

This is the right place where to find all the stuff needed to build a Metro web application.

There are a few easy ways to quickly get started with BootMetro, please read through.

Compiled CSS and JS

The fastest way to get started: get the compiled and minified versions of our CSS, JavaScript, and fonts. No documentation or original source files are included.

Download BootMetro

Latest source code

Get the original files for all CSS and JavaScript, along with a local copy of the docs by downloading the latest version directly from GitHub.

Download BootMetro source

Clone or fork via GitHub

Clone the entire project or fork your own version of Bootstrap to make it your own by visiting us on GitHub.

GitHub repository

View the demo pages

View pages where all different kind of Metro stuff is used, and that you can reuse yourself.

Demo Pages

BootMetro support the following browsers:

  • (latest versions)

Within the download you'll find the following file structure and contents, logically grouping common assets and providing both compiled and minified variations.

Once downloaded, unzip the compressed folder to see the structure of (the compiled) Bootstrap. You'll see something like this:

  └── assets/
        ├── css/
        │   ├── bootmetro.css
        │   ├── bootmetro-icons.css
        │   ├── bootmetro-responsive.css
        │   ├── bootmetro-ui-light.css
        │   ├── bootmetro.min.css
        │   ├── bootmetro-icons.min.css
        │   ├── bootmetro-responsive.min.css
        │   └── bootmetro-ui-light.min.css
        ├── font/
        │   ├── IcoMoon.eot
        │   ├── IcoMoon.svg
        │   ├── IcoMoon.ttf
        │   ├── IcoMoon.woff
        │   ├── LICENSE.txt
        │   ├── opensans-bold-webfont.eot
        │   ├── opensans-bold-webfont.svg
        │   ├── opensans-bold-webfont.ttf
        │   ├── opensans-bold-webfont.woff
        │   ├── opensans-light-webfont.eot
        │   ├── opensans-light-webfont.svg
        │   ├── opensans-light-webfont.ttf
        │   ├── opensans-light-webfont.woff
        │   ├── opensans-regular-webfont.eot
        │   ├── opensans-regular-webfont.svg
        │   ├── opensans-regular-webfont.ttf
        │   ├── opensans-regular-webfont.woff
        │   ├── opensans-semibold-webfont.eot
        │   ├── opensans-semibold-webfont.svg
        │   ├── opensans-semibold-webfont.ttf
        │   └── opensans-semibold-webfont.woff
        └── js/
             ├── bootstrap.js
             ├── bootstrap.min.js
             ├── bootmetro-panorama.js
             ├── bootmetro-pivot.js
             └── bootmetro-icons-ie7.js

This is the most basic form of BootMetro: compiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (bootmetro-*.*), as well as compiled and minified CSS and JS (bootmetro.min.*). The image files are compressed using ImageOptim, a Mac app for compressing PNGs.

Please note that all JavaScript plugins require jQuery to be included.

Prepare your environment

  • Install Node.js and NPM (should come with)
  • Install global dev dependencies (Windows users should run it as administrator): npm install -g grunt-cli karma
  • Instal local dev dependencies: npm install while current directory is bootmetro repo


To build the whole project run grunt

Web server

Running the command node ./server/server.js will start a little local web server that respond on the address localhost:8080; this will enable you to view the documentation and the demo pages locally.

Back to top