MUI is a lightweight CSS framework that follows Google's Material Design guidelines.

Use From the CDN:

<link href="//cdn.muicss.com/mui-0.4.4/css/mui.min.css" rel="stylesheet" type="text/css" />
<script src="//cdn.muicss.com/mui-0.4.4/js/mui.min.js"></script>

Or for development you can use the latest:

<link href="//cdn.muicss.com/mui-latest/css/mui.min.css" rel="stylesheet" type="text/css" />
<script src="//cdn.muicss.com/mui-latest/js/mui.min.js"></script>

Install with NPM:

$ npm install --save-dev muicss

Read more: https://www.npmjs.com/package/muicss

Install with Bower:

$ bower install mui

MUI is designed from the ground up to be fast, small and developer friendly. By design it only includes the basic components you need to build a site that follows Google's Material Design guidelines. Some of the key features of MUI are:

• Small footprint: mui.min.css - 6.6K, mui.min.js - 5.4K (gzipped)
• A responsive grid to make mobile-friendly sites
• No external dependencies
• CSS library that can be customized with your own colors
• JS library can be loaded asyncronously
• Email library for styling HTML emails

To get started using MUI, go to the MUI website to see examples and download boilerplate HTML.

MUI is tested and works in:

• IE10+
• Latest Stable: Firefox, Chrome, Safari
• iOS 6+

1. Install dependencies

• nodejs (http://nodejs.org/)
• npm (https://www.npmjs.org/)
• sass (http://sass-lang.com/)
• http-server (via npm)

1. Clone repository

   $ git clone [email protected]:muicss/mui.git
   $ cd mui

2. Install node dependencies using npm

   $ npm install

3. Build examples

   $ ./node_modules/.bin/gulp examples:build

   To view the examples you can use any static file server. To use the nodejs http-server module:

   $ npm install http-server
   $ ./node_modules/.bin/http-server -p 3000

   Then visit http://localhost:3000/examples

To run the unit tests from the command line, run 'npm test':

$ npm test

To run the E2E tests first compile the unit test files into a version that runs in the browser:

$ ./node_modules/.bin/gulp e2e-tests:build

Then visit http://localhost:3000/e2e-tests

$ ./node_modules/.bin/gulp cdn:build

The build will be located in the packages/cdn directory:

cdn/
├── css
│   ├── mui.css
│   ├── mui.min.css
├── js
│   ├── mui.js
│   └── mui.min.js
├── email
│   ├── mui-email-inline.css
|   └── mui-email-styletag.css
├── react
│   ├── mui-react.js
│   └── mui-react.min.js
└── webcomponents
|   ├── mui-webcomponents.js
|   └── mui-webcomponents.min.js
└── extra
    ├── mui-colors.css
    ├── mui-combined.js
    └── mui-react-combined.js

$ ./node_modules/.bin/gulp npm:build

The NPM package is located in the packages/npm directory.

$ ./node_modules/.bin/gulp meteor:build

The Meteor package is located in the packages/meteor directory.