Get Mobi.css

There are a few easy ways to quickly get Mobi.css


The easiest way to include Mobi.css is using cdnjs:

<link rel="stylesheet" href="" />


cndjs may have some delay to fetch the latest version.

unpkg is a good choice:

<link rel="stylesheet" href="" />

Please notice that this will always fetch the latest version of Mobi.css, which may have breaking changes between major versions, please carefully use it.


You can download Mobi.css in this page.

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

└── dist/
    ├── mobi.css
    ├── mobi.min.css

Please use dist/mobi.min.css for the compressed version.


Use npm to install Mobi.css:

npm install --save mobi.css

You can also use npm to install Mobi.css, and then build Mobi.css to your project with PostCSS, cssnext and other plugins:

@import 'mobi.css';

/* Use variables which declared in mobi-theme-base */
.your-custom-class-name {
    color: var(--color-primary);

There are a lot of ways to build css with PostCSS and it's plugins, take gulp as an example:

const gulp = require('gulp');
const postcss = require('gulp-postcss');
const atImport = require('postcss-import');
const cssNext = require('postcss-cssnext');
const pxtorem = require('postcss-pxtorem');
const cssnano = require('cssnano');
const sourcemaps = require('gulp-sourcemaps');
const rename = require('gulp-rename');

const browserlist = [
    'last 5 iOS versions',
    'last 5 Android versions',
    'last 5 ChromeAndroid versions',
    'last 5 UCAndroid versions',
    'last 5 FirefoxAndroid versions',
    'last 5 OperaMini versions',
    'last 5 OperaMobile versions',
    'last 5 Samsung versions',

    'last 3 Chrome versions',
    'last 3 Firefox versions',
    'last 3 Edge versions',
    'last 3 Opera versions'

const plugins = [
        browsers: browserlist
        propList: [
            'font', 'font-size', 'line-height', 'letter-spacing',
            'margin*', 'padding*', 'border-radius'

gulp.task('build:css', (callback) => {
        .on('end', callback);

I would recommend you a tool to do all above build steps, mobi-util-build-css