Last Updated: February 25, 2016
·
2.53K
· luizbranco

Nib: CSS mixins for Stylus.js

If you have been using Stylus.js, you might want to check nib. It is a collection of CSS mixins and utilities, similar to Compass or Bourbon.

To install:

npm install nib

var connect = require('connect')
  , stylus = require('stylus')
  , nib = require('nib');

var server = connect();

function compile(str, path) {
  return stylus(str)
    .set('filename', path)
    .set('compress', true)
    .use(nib());
}

server.use(stylus.middleware({
    src: __dirname
  , compile: compile
}));

You can import all nib utilities in your .styl files:

@import 'nib' 

or just a specific part of it:

@import 'nib/vendor' 

Then you are ready to go, for e.g.:

border-radius(top left 5px, bottom left 5px)

1 Response
Add your response

Good tip. You could also just download and grab the best ones from http://bourbon.io and/or Compass. Make your own framework in CodeKit or just @import. Converting them into Stylus syntax from Sass isn't that hard.

over 1 year ago ·